千家信息网

CSS编写规范的建议有哪些

发表于:2024-11-17 作者:千家信息网编辑
千家信息网最后更新 2024年11月17日,CSS编写规范的建议有哪些,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。避免过度约束作为一般规则,不添加不必要的约束。CSS Cod
千家信息网最后更新 2024年11月17日CSS编写规范的建议有哪些

CSS编写规范的建议有哪些,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

避免过度约束

作为一般规则,不添加不必要的约束。

CSS Code复制内容到剪贴板

  1. // 糟糕   ul#someid {..}   .menu#otherid{..}     // 好的   #someid {..}   #otherid {..}

后代选择符最烂

不仅性能低下而且代码很脆弱,html代码和css代码严重耦合,html代码结构发生变化时,CSS也得修改,这是多么糟糕,特别是在大公司里,写html和css的往往不是同一个人。

CSS Code复制内容到剪贴板

  1. // 烂透了   html div tr td {..}

尽可能使用复合语法

CSS Code复制内容到剪贴板

  1. // 糟糕   .someclass {   padding-top: 20px;   padding-bottom: 20px;   padding-left: 10px;   padding-right: 10px;   background: #000;   background-image: url(../imgs/carrot.png);   background-position: bottombottom;   background-repeat: repeat-x;   }     // 好的   .someclass {   padding: 20px 10px 20px 10px;   background: #000 url(../imgs/carrot.png) repeat-x bottombottom;   }

避免不必要的重复

CSS Code复制内容到剪贴板

  1. // 糟糕   .someclass {   color: red;   background: blue;   font-size: 15px;   }     .otherclass {   color: red;   background: blue;   font-size: 15px;   }     // 好的   .someclass, .otherclass {   color: red;   background: blue;   font-size: 15px;   }  组织好的代码格式代码的易读性和易维护性成正比。下面是我遵循的格式化方法。CSS Code复制内容到剪贴板// 糟糕   .someclass-a, .someclass-b, .someclass-c, .someclass-d {   ...   }     // 好的   .someclass-a,   .someclass-b,   .someclass-c,   .someclass-d {   ...   }     // 好的做法   .someclass {       background-image:           linear-gradient(#000, #ccc),           linear-gradient(#ccc, #ddd);       box-shadow:           2px 2px 2px #000,           1px 4px 1px 1px #ddd inset;   }

关于CSS编写规范的建议有哪些问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注行业资讯频道了解更多相关知识。

0