1、樣式的層級關係：一個是權重，另一個就是共用樣式和私用樣式了，比如說兩個ul，它們的子元素除了背景色之外都一樣，那可以直接用li {}來定義相同的公用樣式，用 .ul_1 li {} ， .ul_2 li {} 來定義不相同的樣式。可以根據元素之間的差別來選擇用哪種方法。推薦用多層級的方式書寫css選擇器。

2、選擇器優先順序：（!important>）id選擇器>class選擇器（屬性選擇器/偽類選擇器）>標籤選擇器（偽元素選擇器） 同類選擇符條件下層級越多的優先順序越高。優先順序就近原則，同權重情況下樣式定義最近者為準。載入樣式以最後載入的定位為準。

3、樣式衝突：   如果同個元素有兩個或以上衝突的CSS規則，瀏覽器有一些基本的規則來決定哪一個非常特殊而勝出。
        選擇器一樣的情況下後面的會覆蓋前面的屬性。
        使用巢狀選擇器時：
        　　一組巢狀選擇器的實際特性可以計算出來。基本的，使用ID選擇器的值是100，使用class選擇器的值是10，每個html選擇器的值是1。它們加起來就可以計算出特性的值。
        　　p的特性是1（一個html選擇器）
        　　div p的特性是2（兩個html選擇器）
        　　.tree的特性是10（1個class選擇器）
        　　div p.tree的特性是1+1+10=12，（兩個html選擇器，一個class選擇器）
        　　#baobab的特性是100（1個ID選擇器）
        　　body #content .alternative p的特性是112（兩個html選擇器，一個ID選擇器，一個類選擇器）

            基本上，一個選擇器越多特性，樣式衝突的時候將顯示它的樣式。

4、抽離樣式模組
    因為瀏覽器的相容問題，不同瀏覽器對有些標籤的預設值是不同的，如果沒對CSS初始化往往會出現瀏覽器之間的頁面顯示差異。當然，初始化樣式會對SEO有一定的影響，但魚和熊掌不可兼得，但力求影響最小的情況下初始化。
        最簡單的初始化方法： * {padding: 0; margin: 0;} （強烈不建議）


        body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
        body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; }
        h1, h2, h3, h4, h5, h6{ font-size:100%; }
        address, cite, dfn, em, var { font-style:normal; }
        code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
        small{ font-size:12px; }
        ul, ol { list-style:none; }
        a { text-decoration:none; }
        a:hover { text-decoration:underline; }
        sup { vertical-align:text-top; }
        sub{ vertical-align:text-bottom; }
        legend { color:#000; }
        fieldset, img { border:0; }
        button, input, select, textarea { font-size:100%; }
        table { border-collapse:collapse; border-spacing:0; }