很多人對于CSS都是邊干邊學(xué)習(xí)，因為它不像C#之類的語言那么復(fù)雜，看起來似乎挺簡單，然而正是這種對CSS的不完整的理解，導(dǎo)致了許多的CSS代碼破壞了布局，或者帶來了無休止的調(diào)試，以下總結(jié)了八條最常見的錯誤，以及它們的解決之道：
1.不閱讀或者沒有讀過W3C標(biāo)準(zhǔn)的文檔。
上圖是W3C CSS 2.1 規(guī)范截圖，這是當(dāng)前唯一的官方詳細描述CSS2功能的文件，大部分都是干巴巴的條文，不過幸好有許多簡短有用的部分，當(dāng)你不清楚某些CSS性能的時候可以去查閱這個文檔，下面列出一下比較常用的部分：
1.盒模型（The box model）
2.選擇器（Selectors）
3.可視化格式模型(Visual formatting model)尤其是浮動（floats）和塊格式(block formatting contexts)
2.DIV標(biāo)簽湯（ ）
新手寫頁面最容易碰見的情況：DIV一鍋粥，不管什么地方都用一大堆的DIV標(biāo)簽去寫。比如用div去模擬表格，這種用法是完全沒有道理的，增加了頁面的標(biāo)簽污染，這種做法帶來一系列問題：頁面加載慢、需要寫更多的CSS、代碼不容易維護等等。
這種DIV綜合癥基本上來源于對樣式表基本工作機制的誤解。比如一個人寫了一個3層的DIV嵌套，給每個DIV添加對應(yīng)的樣式，如第一個DIV設(shè)置背景色，第二個設(shè)置外邊距，給第三個設(shè)置字體大小，其實他沒有意識到的是，除非絕對必要，這些屬性都可以合并到一個div里去實現(xiàn)。
另一個原因似乎是想用DIV標(biāo)簽去替代諸如H1/H2/LI等更恰當(dāng)?shù)臉?biāo)簽，這是應(yīng)該避免的做法，因為可能會給使用訂閱器、舊的瀏覽器或者手機瀏覽器的用戶帶來問題。
3.ID還是CLASS？
這張圖很形象，橘黃色的是class，藍色的是ID。使用class還是id，這是相當(dāng)大一部分還沒有掌握邏輯化的CSS布局的人的一個通病，澄清一下：ID是定義一個項目的，而class可以定義多個項目。一個很通俗的例子，你的身份證號就是ID，而身份證上寫的“中國”就是class，很多人的身份證上都寫的是中國，但是號碼卻和你的不同。
但是也不要到處亂用class，這仍然是一個對CSS的理解問題，下圖說明了濫用CLASS和合理的用ID的區(qū)別：
4.忽略縮寫。
這個屬于CSS的性能方面，下面一個例子就說明了問題：
新聞熱點
疑難解答
