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


名称栏目:CSS编写规范的建议有哪些
URL地址:http://myzitong.com/article/iehgjs.html