編寫出色CSS代碼的13個建議—總結至《前端大全》公眾號 一：使用Reset但不用全局Reset 如*{margin：0；padding：0；}

這不僅僅因為它緩慢和效率低，而且會導致一些不必要的元素也重置了外邊距和內邊距。Reset不是一成不變的，具體還是要根據項目的不同需求做適當的修改，已達到瀏覽器的兼容和操作上的便利性。我使用的Reset如下： structural elements結構元素：body,h1,h2,h3,h4,h5,h6,hr,p ，blockquote list elements列表元素：dl,dt,dd,ul,ol,li text formatting elements 文本格式元素：PRe form elements表單元素：form，fieldset，legend，button，input，textarea table elements 表格元素：th , td img elements 圖片元素：img img{ border：medium none； padding：0； margin：0； } body，button，input，select，textarea{ font：12px/1.5 ‘宋體’,tahoma,Srial,helvetica,sans-serif; } h1,h2,h3,h4,h5,h6{font-size:100%;} em{font-size:normal;} ul,ol{list-style:normal;} a{text-decoration:none;color:} a:hover{text-decoration:underline:color:#f40;} img{border:0px;} table{border-collapse:collapse;border-spacing:0}

二：良好的命名習慣 請不要使用元素的特征（顏色、位置、大小等）來命名一個class或ID，您可以選擇意義的命名如： .navigation{}，.sidebar{}, .postwrap{} 另外還有一種情況，一些固定的樣式，定義后就不會修改的了，那你 命名時就不用擔憂剛剛說的那種情況，如： .alignleft{float:left;margin-right:20px;} .alignright{float:right;text-align:right;margin-left:20px}; .clear{clear:both;text-indent:-9999px;}

三：代碼縮寫 li{font-:1.2em/1.4em Arial,Helvetica,sans-serif; padding:5px 0 10px 5px; } 更多屬性縮寫，參考《常用css縮寫語法總結》或者下載css-shorthand-Cheat-Sheat.pdf。

四：利用繼承性 如果父元素中的多個字元素使用相同的樣式，那最好把他們相同的樣式定義在其父元素上，讓它們繼承這些css樣式。 .container li{font-family:Georgia,serif；} .container p{font-family:Georgia,serif；} .container h1{font-family:Georgia,serif；} 就可簡寫為： .container{font-family:Georgia,serif；}

五：使用多重選擇器 如果多個選擇器有共同的樣式的話，可以合并，這樣做代碼不但簡潔，還能為你節省空間。如： h1,h2,h3{font-family:Georgia,serif；}

六：適當的代碼注釋 /1、Reset 2、Header 3、Content 4、SiderBar 5、Footer/ 如此你的代碼結構一目了然

七：給你的Css代碼排序

八：保持CSS的可讀性

九：選擇更優的樣式屬性值 CSS中有些屬性采用不同的屬性值，雖然達到的效果差不多，性能上query存在著差異，如： border：0雖然在頁面上看不見，但按照border默認值理解，瀏覽器依然對border-width/border-color進行了渲染，即已經占用了內存值。 而border：none，none即沒有，瀏覽器解析“none”時將不會做出渲染動作，即不會消耗內存值。所以建議使用border：none； 同樣的，display：none隱藏對象瀏覽器不做渲染，不占用內存。而visibility：hidden則會。

十：使用代替@import @import不屬于XHTML標簽，也不是WEB標準的一部分，它對于早期的瀏覽器兼容也不高，并對網站的性能有某些負面的影響。具體可以參考《高性能網站設計：不要使用@import》

十一：使用外部樣式表

十二：避免使用CSS表達式

十三：代碼壓縮