前端初学者最容易忽略的CSS书写规范和顺序

    xiaoxiao2022-07-08  234

    我相信已经有很多人写了这么久的CSS,但大部分前端工作者都没有按照良好的CSS书写规范来写CSS代码,这样就会影响代码的阅读体验。这里由我总结一个CSS书写规范、CSS书写顺序供大家参考。尤其对于初学者来说,更应该学习一下,因为以后的路还很长!

    CSS书写顺序

    1.位置属性(position,top,right, display, float,z-index, 等)

    2.大小(width, height, padding, margin)

    3.文字系列(font, line-height, letter-spacing, color- text-align等)

    4.背景(background, border等)

    5.其他(animation, transition等)

    CSS书写规范

    1.要去掉小数点前面的“0”

    如果你想学习前端可以来这个群,首先是二九一,中间是八五一,最后是一八九,里面可以学习和交流,也有资料可以下载。

    2.使用CSS缩写属性

    有些CSS属性是可以缩写的,比如margin,fontpadding,等等,这样精简代码同时又能提高用户的阅读体验。

    3.不要随意使用id选择器

    id在Javascript是唯一的,不能多次使用,而使用class类选择器却可以重复使用,另外id的优先级优先于class,所以id应该按需要使用,而不能随意的滥用。

    4.简写命名

    很多用户都喜欢简写类名,但前提是要让人看懂你的命名才能简写哦!

    5.连字符CSS选择器命名规范

    长名称或词组可以使用中横线来为选择器命名。

    不建议使用“_”下划线来命名CSS选择器,为什么呢?

    (1)输入的时候少按一个shift键;

    (2)浏览器兼容问题 (比如使用_tips的选择器命名,在IE6是无效的)

    (3)能良好区分JavaScript变量命名。

    最后,希望大家能在以后的学习和工作当中谨记这几条,这样才会成为一个合格的前端工程师!

    最新回复(0)