繼承

css某些屬性具有繼承的特點，它允許樣式不僅應用于某個特定html標簽元素，而且應用于其后代。
如以下代碼，不僅< p>標簽文字變色，< span>標簽也會變色。

p{color:red;}

<p>俱往矣，<span>數風流人物，</span>還看今朝。</p>

但是有些屬性不具有繼承性，如：

p{color:red;border:1px solid red;}

<p>俱往矣，<span>數風流人物，</span>還看今朝。</p>

效果：

如果想< span>標簽也加邊框，需要單獨設置：

<p>俱往矣，<span style="border:1px solid blue">數風流人物，</span>還看今朝。</p>

效果：

特殊性-權值

權值的存在，決定了我們在對同一個標簽設置不同的css樣式時會使用哪一個，如：

p{color:red;}
.first{color:green;}
<p class="first">俱往矣，數風流人物，還看今朝。</p>

效果會是綠色，原因就是權值的存在
標簽的權值為1，類選擇符的權值為10，ID選擇符的權值最高為100。例如下面的代碼：

p{color:red;} /*權值為1*/
p span{color:green;} /*權值為1+1=2*/
.warning{color:white;} /*權值為10*/
p span.warning{color:purple;} /*權值為1+1+10=12*/
#footer .note p{color:yellow;} /*權值為100+10+1=111*/

繼承的權值最小，小于1

層疊

上面講了權值，那么會有一個問題，如果權值一樣的結果會怎樣呢？層疊就是當權值一樣的時候后定義的樣式會覆蓋前面定義的樣式，如：

p{color:red;}
p{color:green;}
<p>數風流人物，還看今朝。</p>

字體會是綠色
這樣就可以理解css樣式優先級了：
內聯樣式表（標簽內部）> 嵌入樣式表（當前文件中）> 外部樣式表（外部文件中）

注意：

如果有些情況，我們不希望后面的覆蓋前面的樣式，我們可以定義最高權值，使用!important，如：

p{color:red!important;}
p{color:green;}
<p>數風流人物，還看今朝。</p>

這樣字體就會是紅色了