a標籤樣式繼承的問題

一 a標籤繼承不了父元素的樣式？

咱們知道，諸如font-size,color等一些屬性是能夠經過繼承父元素獲得的。那麼，爲何當咱們想讓a標籤去繼承父元素的顏色時，結果卻經常不能如咱們所願呢？
要想弄明白這個問題，首先咱們要去了解一個概念-層疊樣式表的層疊關係

二 層疊樣式表的層疊關係

層疊是css中的核心，它定義了一個如何合併來自多個源的屬性值算法。Mdn定義
也能夠簡單理解爲當有多個樣式表去做用於一個元素的時候，這個元素應該採起哪些樣式表裏的樣式。
那麼這樣就會涉及一個層疊優先級的問題。咱們能夠來看看下面這張圖（也能夠去MDN中查看）

說明：
（1）用戶代理表示的是瀏覽器默認樣式，瀏覽器本身都會有一套默認樣式，不一樣的瀏覽器默認樣式可能不同。
（2）頁面做者指的就是頁面開發人員了。
（3）而用戶指定就是頁面的使用者了。（其實咱們不多會去本身設置css屬性）
從上圖中咱們能夠看出，瀏覽器的默認樣式的優先級是最低的。其次是用戶的樣式，可是要注意的是用戶的樣式中若是加!important強調，則其優先級最高，超過開發者加!important強調。
咱們來看一個關於層疊優先級的demo

//html結構
 <div>
   <p class="test"></p> 
 </div>
//
//用戶代理
p{margin-left:5px;}
//頁面開發者
p{margin-left:6px;}
//用戶樣式表
.test{margin-left:10px;}
//output
margin-left:6px;

從上面的demo中，咱們能夠看出，即便用戶樣式表的css選擇器優先級優於頁面開發者，可是最終的樣式依舊是頁面開發者指定的樣式，所以咱們知道標籤的css屬性，層疊的優先級是大於css選擇器的。（固然前提是css規則都做用到了某個元素。）

三 a標籤問題分析

經過了解以上的知識，咱們實際上就能分析出a標籤爲何不能繼承父元素的顏色。這主要是由於用戶代理實際上已經爲a標籤設置好了一個顏色。它不會再去繼承父元素的顏色了。（其實繼承了，可是由於是繼承的，全部優先級比不上本身自己設置的。繼承的css屬性優先級是最低的)
解決方法：
咱們經過一句簡單的css樣式就能解決這個問題

a{color:inherit}