我認為壹個好的CSS架構的目標應該與所有好的軟件開發的目標沒有太大的不同。我希望我的CSS是可預測的、可重用的、可維護的和可擴展的。
可預言的
可預測的CSS意味著您的規則可以按照您期望的方式運行。當您添加或更新規則時，它不應該影響您的網站中您不想影響的部分。這在很少更改的小型網站中並不重要，但在擁有數十或數百個頁面的大型網站中，可預測的CSS是必要的。
可重復使用的
CSS規則應該足夠抽象和可解耦。您不必重新編碼已經解決的模式和問題，但您可以通過依賴現有部分快速構建新組件。
可維持的
當您的網站需要添加、更新或重新安排新的組件和功能時，它不需要重構現有的CSS。向頁面添加組件A不應該破壞組件B..
開口的
隨著網站規模和復雜性的增長，通常需要更多的開發人員來維護網站。可擴展的CSS意味著它可以由壹個人或壹個大型工程團隊輕松管理。這也意味著您的網站的CSS架構可以輕松學習和掌握，而無需大量的學習曲線。不能因為妳目前是維護CSS的開發人員就忽視未來的變化。
常見的不良做法
在我們尋找實現好的CSS架構目標的方法之前，我認為查看阻止我們實現目標的常見實踐是有幫助的。只有理解那些重復的錯誤，我們才能開始接受另壹條道路。
盡管在技術上是有效的，但它們的結果卻導致了災難和令人頭疼的問題。雖然我的意圖是好的，我希望每壹個發展都是不同的，但這些模式繼續給我帶來麻煩。
根據父類修改組件
幾乎每個網站都有壹個特定的視覺元素，看起來與每個事件完全壹樣，只有壹個例外。霍穎北大青鳥認為，對於這種壹次性的情況，幾乎每個新的CSS開發人員（即使是有經驗的開發人員）都會以相同的方式處理。您需要為這個特定事件找到壹個父元素（或創建壹個），然後編寫壹個新規則來處理它。