3.1.1 層疊性
所謂層疊性，是指對同一元素同一屬性的設定，後設定的某個樣式（屬性），會覆蓋之前設定的樣式。
比如：
.cc1{ color: red;}
.cc1{color: blue;}
<div class=”cc1”>文字內容</div>
則class爲cc1的元素中的文字顏色就是blue，即後者覆蓋了前者的設定。
分兩種情況：
１，兩個相同的選擇器，設置了同樣的屬性，後者覆蓋前者——層疊性體現之一。
２，兩個不同但同級優先性的選擇器，設置了同樣的屬性，也是後者覆蓋前者——體現之二。
3.1.2 繼承性
所謂繼承性，是指對某個元素所設定的樣式，不但影響該元素本身，還可能影響該元素的後代元素。
比如：
.cc1{color:red;}
<div class=”cc1”>
文字1
<p>文字2</p>
</div>
則此時文字1和文字2實際都是紅色。
注意：
實際上繼承性不是普遍情況，而只是少數一些屬性才具有繼承性（即能夠影響後代元素）。
應用中繼承性通常用在有關文字的屬性上。
3.1.3 優先性
所謂優先級，就是指一個標籤的顯示效果（樣式表現），可能受若干個因素的影響，但哪一個因素的影響大，則最終效果就按該因素的設定，也就是“更優先”的意思。
比如：
#pro{ font-size: 20px; }
.ppp{ font-size: 18px; }
<div id=”pro” class=”ppp”> 小米Note 4 </div>
則此時該文字的大小實際是20px。
那，優先級怎麼定的？
結論如下：
僞元素選擇器 > !important > 行內樣式 > id選擇器 > 類選擇器（或僞類選擇器） > 元素選擇器 > * > 繼承樣式 > 瀏覽器默認樣式
其中，僞元素選擇器又有： ::first-letter > ::selection > ::first-line
上述黃色背景部分在實際應用中最常見。
什麼是“!important”?
就是在一個屬性的設定中，在屬性值後面加“!important”標識，然後在加分號（;），例如：
.c1{ color: red!important; }
#d1{ color: yellow; }
此時，如果上述兩個選擇器都能選中某一個元素，則其中的文字就是紅色（!important優先了）
選擇器的優先級怎麼計算？
對於複合選擇器（比如div.c1， 或 #id1>.c2， 或#id2>.c3 p span，等等），又該怎麼確定他們的優先級呢？
首先，根據上述的基本優先級原則，遵循“官大一級壓死人”的規則。
比如：
選擇器1： #id1{.....}
選擇器2： .c1>.c2>p{....}
則選擇器1優先；
其次，如果具有同級的優先級，則比誰的數量多。
比如：
選擇器1： .cc1 .cc3 {.....}，
選擇器2： .cc1 .cc2 .cc3 {....}
則選擇器2優先；
最後，綜合上述兩條規則就可以判斷出哪個是優先的。
