本節(jié)內(nèi)容
- 課時83 谷歌開發(fā)者工具其它使用(理解)
- 課時84 繼承性(掌握)
- 課時85 層疊性(掌握)
- 課時86 優(yōu)先級(掌握)
- 課時87 !important(掌握)
- 課時88 權(quán)重問題(掌握)
- 課時89 CSS三大特性練習(xí)(理解)
谷歌開發(fā)者工具其它使用
f12按開后自己玩去吧砾层!
繼承性
給我們的父元素設(shè)置的屬性吗坚,子元素也是可以使用的馏谨,這就是繼承性
注意點(diǎn)
- 并非所有屬性都可繼承彼绷,只有以color/font-/text-/line開頭的屬性是可以繼承的
- 不僅僅是兒子可以繼承权旷,只要是后代都可以繼承
- css繼承性的特殊性:
- a標(biāo)簽的字體顏色和下劃線是不能繼承的
- h標(biāo)簽文字大小是不能繼承的
應(yīng)用場景
一般用于設(shè)置網(wǎng)頁上的共性信息织盼,如網(wǎng)頁文字顏色闻牡,字體妄田,文字大小等內(nèi)容俺亮,一般情況下,這樣設(shè)置:
body{
騷操作;
}
層疊性
就是css處理沖突的一種能力疟呐,
注意點(diǎn)
- 只有在多個選擇器選中“同一個標(biāo)簽”脚曾,然后設(shè)置了“相同的屬性”,才會發(fā)生層疊性
優(yōu)先級
當(dāng)我們的多個選擇器選中“同一個標(biāo)簽”启具,然后設(shè)置了“相同的屬性”本讥,如何層疊就由優(yōu)先級來確定
優(yōu)先級判斷的三種方式
- 是否是直接選中(間接選中就是指繼承)
- 若是間接選中,誰離著標(biāo)簽近就聽誰的
- 相同的選擇器
- 若都是直接選中鲁冯,且都是同類型的選擇器拷沸,誰寫在后面就聽誰的
- 不同選擇器
- 都是直接選中,并且不是相同類型的選擇器薯演,那么就會按照選擇器的優(yōu)先級來層疊
- 選擇器優(yōu)先級:id>類>通配符>繼承>瀏覽器默認(rèn)
優(yōu)先級之!important
用于提升摸個直接選中標(biāo)簽的選擇器中的某個屬性的優(yōu)先級撞芍,可以將被指定的屬性優(yōu)先級提升為最高
注意
- 間接選中就不能用,必須是直接引用才行
- 通配符選擇器選擇的也是直接選中的
- 他只能提升被指定的優(yōu)先級跨扮,其他屬性的優(yōu)先級不會被提升
- 他必須寫在分號前面序无,斜后面就不對了
- 感嘆號是不能省略的
優(yōu)先級之權(quán)重問題
當(dāng)多個選擇器混合在一起使用的時候,可以計(jì)算權(quán)重判斷誰的優(yōu)先級最高
計(jì)算規(guī)則
- 首先計(jì)算選擇器中有多少個id衡创,id多的選擇器優(yōu)先級最高
- 若id個數(shù)一樣帝嗡,再看class的個數(shù),class多的優(yōu)先級最高
- 若class個數(shù)一樣璃氢,再看標(biāo)簽名稱的個數(shù)丈探,標(biāo)簽名稱個數(shù)多的優(yōu)先級最高
- 若id、class拔莱、標(biāo)簽名稱都一樣的話碗降,就不會繼續(xù)往下計(jì)算權(quán)重,誰寫在后面就聽誰的
注意點(diǎn)
- 只有選擇器直接選中標(biāo)簽的時候才計(jì)算權(quán)重