一、關于CSS樣式分離
zxx://一些名詞表意含有自己的理解成分，或許與您的理解有偏差，希望不要拘泥于措辭。
無論是CSS的分離還是js的分離，其主要作用之一就是精簡與重用。
CSS本身就代表著精簡與重用。例如我們可以設置一個如下的樣式：
.example{color:red;}所有想讓文字顯示紅色的標簽都可以應用這個樣式，這比10年前使用font標簽，將color樣式寫在font標簽上（尤其標簽多時）要精簡很多代碼，代碼可讀性也更佳。
CSS樣式分離，我一般指的是“以單獨的CSS文件將CSS樣式分離出來”，此處的重用多針對不同頁面的重用，就是說，一個樣式文件，可以多個頁面使用，這對于一些公共樣式的重構是很有用的。當然，對于一些重要的頁面，例如淘寶首頁，直接將CSS嵌在了頁面頭部，其降低鏈接請求的重要性要大于樣式的重用。
以上估計大家都是很熟悉與常用的，我一般不會拿一些眾所周知的白蠟拿來嚼的。本文會展示一些新的東西，關于CSS樣式分離再分離。本文核心不在于展示如果分離，而是傳達一種“庫”與“CSS高度重用”的概念，同時也是為后面的文章“我是如何對項目CSS進行架構”做鋪墊的。

二、CSS樣式分離之再分離
“CSS樣式分離之再分離”表型上的兩個特點為“分離”和“命名”，掌握與理解其深層次思想的關鍵是思維方式的轉變，這包括“CSS庫概念”意識。舉個例子吧，依照現在主流的寫法，下截圖所示的灰色背景的框框命名與樣式可能如下：
pic

.topic_edit_box{display:inline-block; border:1px solid #ddd; background:#f7f7f7; padding:20px 40px;}

如果您有強烈的分離意識，尤其在大型的項目中，這段樣式可能會是這個樣子（注意命名）：

.dib{display:inline-block;}
.bdd border:1px solid #ddd;}
.bgf7{background:#f7f7f7;}
.p20_40{padding:20px 40px;}

字面上很容易理解，就是把這段樣式分離成一個一個單獨的樣式。當然，這只是表象，要想讓樣式再分離發揮其最大的功效，對其精髓思想有著較為深入的理解是很必須的，否則，您可能會用的很痛苦，或是濫用而產生其他一些問題。

三、樣式分離再分離精簡作用的理論基礎
高中時學習馬克思主義哲學，記得有部分是關于理論與實踐的，“理論指導實踐”，這句話對我影響很大。在我看來，任何一門學問，要想做到一定的高度，必須有一定的理論基礎，這個理論可以在別人看來或是100年后看來是錯誤的，只要能在當下解釋清楚，自圓其說，這就是優秀的理論。即使是做技術也是如此，我現在總是會從哲學中找到與現在所從事的技術所相同的地方，并將之歸納，以自己一套理論解釋它，當然，這個理論不是憑空而來，而是在其他一些理論基礎上建立起來的，例如，中國古代的那些傳承千年的哲學觀。