CSS選擇器優(yōu)先級-走一趟再說
來源：懂視網(wǎng)
責(zé)編：小采
時間：2020-11-27 16:42:12
CSS選擇器優(yōu)先級-走一趟再說
CSS選擇器優(yōu)先級-走一趟再說:1.類的覆蓋順序和應(yīng)用的時候引用的順序沒關(guān)系，覆蓋順序取決于類定義的順序 例如： .a{ color:red } .b{ color:green } 由于b晚于a定義，所以b覆蓋a，反之則a覆蓋b 2.類選擇器優(yōu)先級大于標(biāo)簽選擇器； 例如： div{ color:r
導(dǎo)讀CSS選擇器優(yōu)先級-走一趟再說:1.類的覆蓋順序和應(yīng)用的時候引用的順序沒關(guān)系，覆蓋順序取決于類定義的順序 例如： .a{ color:red } .b{ color:green } 由于b晚于a定義，所以b覆蓋a，反之則a覆蓋b 2.類選擇器優(yōu)先級大于標(biāo)簽選擇器； 例如： div{ color:r
1.類的覆蓋順序和應(yīng)用的時候引用的順序沒關(guān)系，覆蓋順序取決于類定義的順序
例如：
.a{
color:red
}
.b{
color:green
}
由于b晚于a定義，所以b覆蓋a，反之則a覆蓋b
2.類選擇器優(yōu)先級大于標(biāo)簽選擇器；
例如：
div{
color:red
}
.div{
color:green
}
.div將覆蓋div
3.類選擇器優(yōu)先級等于純屬性選擇器，誰后定義誰優(yōu)先級高，例如：
[data-name='div']{
color: red
}
.a{
color:blue
}
.a將覆蓋[data-name='div']，反之[data-name='div']覆蓋.a
4.類選擇器優(yōu)先級小于標(biāo)簽+屬性組合選擇器，例如：
div[data-name='div']{
color: red
}
.a{
color:blue
}
.a將被div[data-name='div']覆蓋
5.類選擇器優(yōu)先級小于id選擇器，例如：
.a{
color:blue
}
#div{
color: red
}
.a將被#div覆蓋
6.標(biāo)簽+屬性組合選擇器優(yōu)先級小于id選擇器，例如：
[data-name='div']{
color:blue
}
#div{
color: red
}
#div將會覆蓋[data-name='div']
7.標(biāo)簽選擇器優(yōu)先級小于id選擇器，例如：
div{
color:blue
}
#div{
color: red
}
#div將會覆蓋div
8.標(biāo)簽選擇器優(yōu)先級小于純屬性選擇器，例如：
div{
color:blue
}
[data-name='div']{
color: red
}
div將會被 [data-name='div']覆蓋
綜上所述： 標(biāo)簽選擇器<類選擇器=純屬性選擇器（先定義會被覆蓋）<標(biāo)簽+屬性組合選擇器
聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
CSS選擇器優(yōu)先級-走一趟再說
CSS選擇器優(yōu)先級-走一趟再說:1.類的覆蓋順序和應(yīng)用的時候引用的順序沒關(guān)系，覆蓋順序取決于類定義的順序 例如： .a{ color:red } .b{ color:green } 由于b晚于a定義，所以b覆蓋a，反之則a覆蓋b 2.類選擇器優(yōu)先級大于標(biāo)簽選擇器； 例如： div{ color:r
