要知道,CSS对于互联网来说是很重要的,正是因为CSS的存在,让我们的网页才能更加的形式多样及美观。很多开发者觉得CSS简单,但却不知道想要精通CSS也是较难的,不同的人写出的CSS也存在着性能差异。
那对于CSS而言,如何写才能让CSS更优雅和高效呢?
优雅的CSS代码具有的特性虽然说CSS没有一套官方的编码规范,但很多开发者在实际编码过程中还是总结出了一些心得让CSS代码规范化,主要措施有:
1、CSS代码命名要统一规范
不同公司的代码规范不同,最基本的要求是同一个项目的代码看上去要像一个人写的。
2、重置默认的CSS样式
此举是为了消除不同浏览器下的默认样式渲染差异的。
3、尽可能少的使用ID选择器,多使用class选择器
因为ID代表的是唯一,所以ID选择器不具备复用性,尽可能不使用ID选择器。
4、选择器和CSS属性及值全为小写
5、如果属性值为0,则后面不要带单位
6、用完了浮动后一定要清除浮动
7、模块化开发
模块化开发可以让项目代码整体看上去很清晰,结构感强。可借助amd、CommonJS、es6、webpack等来模块化开发。
8、CSS代码尽可能简洁化
同样,CSS代码很多样式是可以合并去写的,比如上边距与下边距如果分开写就是2条样式,但我们完全可以合并为一条去写。
如何让CSS运行更高效?不要以为CSS代码没有性能开销,CSS代码如果写得不合理那同样很占性能,想写出高效的CSS那需要遵循以下:
1、尽可能不使用内联样式,改用外链样式表方式引入;
2、CSS代码内不要使用函数、表达式;
3、CSS外链文件进行压缩(去除不必要的空格、换行、Tab、注释等),同时服务器端开启GZip压缩,加快样式文件的加载速度;
4、尽可能少的进行绝对定位操作;