這是一個相對繁雜的CSS理論,分為Base、Layout、Module、Status和Theme共五個部分。不過它的核心思想仍然和OOCSS類似,鼓勵使用class。
1. Base 基本屬性
基礎屬性很容易理解,就是最基本的東西,很多樣式簡單的網站都采用一個簡單的二級CSS文件模式,一個base.css通用于所有頁面,而每個頁面有一個特定的CSS文件,我想這就是Base的雛形。要說具體是什么,比如reset文件,再比如放置clearfix或BFC的一些類似工具集的文件。
其實最終會發現,在Base中的CSS屬性將會是幾乎全站都要用到的屬性,但我不想這么描述Base,因為這會誤導人。大多數情況下,在一個網站建立之初也只會有幾個簡單的頁面,于是這幾個頁面都要用到的屬性就變成了通用屬性,但并不是這么簡單的。隨著網站規模的擴大,需求的增加,設計師們靈感的迸發,所謂的通用和統一也在發生著潛移默化。所以在編寫Base時,應該遵循的基準是,哪些樣式是你做下一個網站時也會想用的,哪些樣式即使設計改變了也只需要改變一些數值和顏色,哪些樣式是一些基本原則;而不應該將目前大部分頁面都在使用的樣式放在Base中,還是那個道理,它們也許僅僅是恰好相同,而非邏輯一致。
2. Layout 布局
布局是一個網站的基本,無論是左右還是居中,甚至其他什么布局,要實現頁面的基本瀏覽功能,布局必不可少。SMACSS將這一功能單獨提出也是非常正確的,另外還約定了一個前綴l-/layout-來標識布局的class。舉個最普遍的例子。
新聞熱點
疑難解答