日期:2014-01-30 浏览次数:21373 次
CSS的优化通常包括两方面: 格式化CSS和精简CSS。
精简CSS的办法是把具有相反属性的元素合并在一同,但这会降低代码的可读性,使代码的后期维护很麻烦,稍不留意就出错。
格式化CSS普通就是多行模式或单行模式的选择,比如我团体就完全受不了多行模式
下面是一些在线的CSS优化工具,能让你方便的对CSS文件进行各种优化处理。
1. Online CSS Optimizer /在线CSS优化
该在线工具用于精简和紧缩款式表的文件大小,优化后的代码将完全是混乱的,支持输入URL,提交文件和直接输入进行紧缩。
作用同上,但这个工具拥有非常详细的紧缩选项,它包含基本模式和高级模式。
在基本模式下, 你可以选择紧缩模式: 轻度,标准和高度。最高模式紧缩后的文件最小,但同时可读性也就最低,甚至紧缩后就出问题也可能,以此类推。还可以选择CSS注释代码的处理: 不处理注释,清除所有注释或限定注释字符数。
在高级模式下,还可以对空白,Tab,新行等等进行选择处理。
基于 CssTidy 的一款在线CSS优化工具,既可以格式化CSS代码,也可以优化CSS减少CSS文件大小,包含非常详细的选项设置。比如选择器和属性的排序,大小写转换等等。
检查款式表的无效性,验证款式表能否符合 W3c 标准,同时进行颜色对比测试和确保尺寸的单位(W3C的Guideline 3.4 建议使用绝对而非绝对单位,虽然px是绝对单位,但是最终的字体大小却取决于输出介质,所以建议是使用百分比和em等尺寸单位。)
5. Format CSS Online /在线CSS格式化工具
这是一个专门用于格式化CSS款式表文件的在线工具,讨论该使用”多行模式”还是”单行模式”或其它模式是没什么意义的,不如大家就按本人的模式去做,在协作的时候用工具重新格式化成本人喜欢的模式就好了。
6. Tabifier
非常简单的格式化工具,通过添加代码的缩进来让代码更具可读性。
一款多用途代码优化工具,提供多种选项,除 CSS 外,还支持 PHP,Java,C++,C,Perl,JavaScript 等多种言语。
8. Styleneat
简单易用的CSS格式化工具,虽然选项不多,但还是蛮实用的,支持直接输入,上传文件和输入URL。
最后,团体的一些建议: 使用在线工具进行格式化,但不要使用在线工具进行紧缩,最好本人手动进行一些元素和属性合并。