自我進入這個行業，我就發現開發人員一直在努力征服css。
理由也很充分，開發人員是用邏輯思考的生物。添加一個div元素導緻所有代碼都不得不往下移一行，而另一個div“浮”到左側，感覺沒有任何意義。
你也一定聽到過開發人員的抱怨：
“我們隻需要向左邊移動五個像素，但是…天哪！為什麼整個都向下移動了一行。到底是哪裡錯了？！？！？！”
是以，我們今天就來聊一聊css中的十大錯誤的做法。
根據我作為開發人員使用css的經驗，下面是我的十個“不要”。
1.不要濫用類
在有意義的地方使用id而不要使用類。這是一個使得浏覽器能夠更快通路dom元素的方法。
2.不要把一切都扔進一個css檔案中
分區css使其更易于管理。每一個css檔案都可以分解成例如header.css、footer.css等邏輯元件。
3.不要命名選擇器為“.red-with-green-dashed-lines”（紅綠虛線)
根據頁面上的元件命名你的選擇器。例如：“header-left”，“content-title”或“content-date”更具描述性。
4.不要忘記注釋
注釋在css中非常重要，可用來了解每個樣式如何與其他樣式關聯以及什麼顔色方案适用于哪些元件。
5.不要害怕開發工具
現在的每個浏覽器都有自己的一套開發工具，通常是按f12。這些工具在“調試css”時至關重要。
6.不要害怕覆寫
7.不要濫用 !很重要
css的整體思路是，從一個到另一個地“層疊”樣式。 !重點是要記住排雷一樣地踏遍所有早先的樣式。 : -)
8.不要使用大量網絡字型
這也是顯而易見的，但有些人就是喜歡自己排版。隻在網站上使用一個或兩個（最多三個）網絡字型，然後回歸到浏覽器預設設定，以保持網站的優化。
9.不要手動編碼所有的css
為了保持css的dry，可以使用css預處理程式例如less或sass。使用這些預處理器的最大好處是，你可以定義變量，例如在上面定義配色方案，然後重複使用到所有css，而不必當你需要修改的時候追蹤每個顔色。
10.不要讓css過于“臃腫”
空格會占用css檔案的空間空間。由于我們都希望我們的css能夠快速加載，是以在部署到網站之前最好使用css壓縮工具來一次瘦身。
以上隻是我作為一個開發人員在編寫css時認為不應該做的事情。歡迎提出不同的看法。
作者：小峰
來源：51cto