CSS代码规范

聊骚

又一段时间没有写推文了,并不是我没有时间,而是我把时间都花在了我刚搭的博客上啦,有兴趣的小伙伴可以来我博客看技术文哒。最近写了很多新文章,都在博客上,欢迎光临!~

今天写的这篇推文同样已经收录到我的博客中了~

简介

代码格式同样属于规范的一部分,作为一名优秀的前端程序员,就得好好学习如何提高代码的可读性和可维护性~

规范

小写

选择器、属性以及其值都使用小写

单行定义样式

顾名思义,代码写在一行,这样更简洁清晰~

属性值分号结尾

一般最后一个属性值可以省略分号,不过加上分号不容易出错~

0时省略单位

属性值为0的时候就可以不用加上单位了,这样可以省略一些不必要的字母

十六进制表示颜色值

除非使用rgba增加透明度,颜色一般都用十六进制表示~

值缩写

通过缩写属性值可以减少

选择器合并

如果多个元素有相同的样式,那么将选择器写到一起并用逗号隔开

属性顺序

先布局属性、接着为自身属性、最后到文本属性~

使用单引号

省略url中的引号,其他需要引号的地方使用单引号~

私有在前,标准在后

带有浏览器私有标志的放在前面,然后是W3C标准的~

注释

一般使用的是块级注释,注释一般写在注释对象的上一行,而行内注释写在对应属性的分号后~

减少js对CSS的直接修改

最后提醒一下:能用CSS写的就不要用js去写。当然也可以结合CSS和js,如:提前写好一个类的样式,然后通过js给DOM元素增加类从而增加对该元素的样式。

总结

结合上述所说的去规范自己,就能写上漂漂亮亮的CSS代码啦~

关注不吃亏

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180922G1R87F00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券