溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要講解了“css樣式的繼承性、層疊性 、優先級有什么作用”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“css樣式的繼承性、層疊性 、優先級有什么作用”吧！
一、css樣式的繼承性:
作用：給父元素設置一些屬性，子元素也可以使用
應用場景：
一般用于設置網頁上的一些共性信息，例如網頁的文字顏色，字體，文字大小等內容。優化代碼，降低工作量
注意點：
1.并不是所有的屬性都可以繼承，、
只有color/font-/text-/ line開頭的屬性才能繼承；
2.在css的繼承中，不僅僅是兒子可以繼承，只要是后代
都能繼承
3.繼承性中的特殊性
3.1 a標簽的文字和顏色
和下劃線是不能繼承父元素的——舉例：
復制代碼
<style type="text/css">
div{
color:red
font-size:24px;
text-decoration: none;
}
</style>
<body>
< div>
<h2>我是大標題</h2>
<a heref="#">我是超鏈接</a>
<p>我是段落</p>
</div>
（上面的代碼，只有p繼承了div設置的屬性，而a標簽是不能繼承父元素的屬性,顏色不會變紅，下劃線也不會被去掉）
復制代碼
3.2 h標簽的文字大小也是不能繼承父元素的(見上面代碼，<h2>標簽中我是大標題不會繼承<div>的
font-size:24px;屬性，所以需要給<h2>單獨寫個css樣式：h2{font-size:24px;}
應用場景：
一般用于設置網頁上的一些共性信息，例如網頁的文字顏色，
字體，文字大小燈內容
格式：
body{屬性：值;}
二、層疊性
比如p標簽，給p標簽設置id和class類名，選擇器上選擇p
和p的id或者class類名，設置相同的屬性，就是層疊性
三、優先級：（三一）
作用：當多個選擇器（比如選擇p標簽和p標簽里設置的id或者class昵稱），選中同一個標簽，并且給同一個標簽設置相同的屬性時，
如何層疊就優先級來確定。
2.優先級判斷的三種方式
2.1
是否直接選中，直接選中指的是直接選中要設置css樣式的標簽，和標簽的id或者class類名。（間接選中就是指的是繼承性，比如選擇<ul>那里面的li繼承ul的屬性，就稱為繼承屬性）
如果是間接選中，誰離目標標簽比較近就聽誰的。
2.2是否是相同的選擇器。
如果是相同選擇器，那么就是誰寫在后面就聽誰的。（比如給兩個p標簽設置css樣式
p{color:blue}
p{color:red｝
那么就會以第二個p為標準，文字變成紅色
2.3不同的選擇器
如果都是直接選中，并且不是相同類型的選擇器，那么就會按照
選擇器的優先級來層疊
id>類>標簽>通配符>繼承>瀏覽器默認
權重計算
如果選擇器里有直接選中和間接選中。哪怕是間接的選擇器為id選擇器，也會優先實行直接選中的效果。
感謝各位的閱讀，以上就是“css樣式的繼承性、層疊性 、優先級有什么作用”的內容了，經過本文的學習后，相信大家對css樣式的繼承性、層疊性 、優先級有什么作用這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
