格式化CSS和精简CSS的在线CSS优化工具

心情公主68

心情公主68

2016-02-19 23:47

今天天气好晴朗处处好风光,好天气好开始,图老师又来和大家分享啦。下面给大家推荐格式化CSS和精简CSS的在线CSS优化工具,希望大家看完后也有个好心情,快快行动吧!

CSS的优化通常包括两方面: 格式化CSS和精简CSS

精简CSS的办法是把具有相同属性的元素合并在一起,但这会降低代码的可读性,使代码的后期维护很麻烦,稍不注意就出错。

格式化CSS一般就是多行模式或单行模式的选择,比如我个人就完全受不了多行模式 

下面是一些在线的CSS优化工具,能让你方便的对CSS文件进行各种优化处理。

1. Online CSS Optimizer /在线CSS优化

该在线工具用于精简和压缩样式表的文件大小,优化后的代码将完全是混乱的,支持输入URL,提交文件和直接输入进行压缩。

2. CSS Compressor/CSS压缩

作用同上,但这个工具拥有非常详细的压缩选项,它包含基本模式和高级模式。

在基本模式下, 你可以选择压缩模式: 轻度,标准和高度。最高模式压缩后的文件最小,但同时可读性也就最低,甚至压缩后就出问题也可能,以此类推。还可以选择CSS注释代码的处理: 不处理注释,清除所有注释或限定注释字符数。

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

在高级模式下,还可以对空白,Tab,新行等等进行选择处理。

3. CleanCSS / CSS格式化和优化工具

基于 CssTidy 的一款在线CSS优化工具,既可以格式化CSS代码,也可以优化CSS减少CSS文件大小,包含非常详细的选项设置。比如选择器和属性的排序,大小写转换等等。

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

4. CSS Analyzer / CSS有效性分析工具

检查样式表的有效性,验证样式表是否符合 W3c 标准,同时进行颜色对比测试和确保尺寸的单位(W3C的Guideline 3.4 建议使用相对而非绝对单位,虽然px是相对单位,但是最终的字体大小却取决于输出介质,所以建议是使用百分比和em等尺寸单位。)

5. Format CSS Online /在线CSS格式化工具

这是一个专门用于格式化CSS样式表文件的在线工具,讨论该使用多行模式还是单行模式或其它模式是没什么意义的,不如大家就按自己的模式去做,在协作的时候用工具重新格式化成自己喜欢的模式就好了。

6. Tabifier

非常简单的格式化工具,通过增加代码的缩进来让代码更具可读性。

7. Pretty Printer

一款多用途代码优化工具,提供多种选项,除 CSS 外,还支持 PHP,Java,C++,C,Perl,JavaScript 等多种语言。

8. Styleneat

简单易用的CSS格式化工具,虽然选项不多,但还是蛮实用的,支持直接输入,上传文件和输入URL。 

最后,个人的一些建议: 使用在线工具进行格式化,但不要使用在线工具进行压缩,最好自己手动进行一些元素和属性合并。

展开更多 50%)
分享

猜你喜欢

格式化CSS和精简CSS的在线CSS优化工具

Web开发
格式化CSS和精简CSS的在线CSS优化工具

10款非常棒的CSS代码格式化工具推荐

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
10款非常棒的CSS代码格式化工具推荐

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

CSS代码格式化和压缩的方法与技巧

Web开发
CSS代码格式化和压缩的方法与技巧

WEBJX收集CSS格式化和造型网页高级教程

Web开发
WEBJX收集CSS格式化和造型网页高级教程

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

帮助你学习CSS的在线CSS工具网站

Web开发
帮助你学习CSS的在线CSS工具网站

CSS优化:less优化CSS

Web开发
CSS优化:less优化CSS

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

认识Opera浏览器和IE浏览器

认识Opera浏览器和IE浏览器

「OhDear:You are weakness in my eye」

「OhDear:You are weakness in my eye」
下拉加载更多内容 ↓