如何理解瀏覽器對于CSS不同類中的同屬性不同值優(yōu)先級問題-創(chuàng)新互聯(lián)

這篇文章主要介紹“如何理解瀏覽器對于CSS不同類中的同屬性不同值優(yōu)先級問題”，在日常操作中，相信很多人在如何理解瀏覽器對于CSS不同類中的同屬性不同值優(yōu)先級問題問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”如何理解瀏覽器對于CSS不同類中的同屬性不同值優(yōu)先級問題”的疑惑有所幫助！接下來，請跟著小編一起來學(xué)習(xí)吧！

創(chuàng)新互聯(lián)專注于信陽網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。熱誠為您提供信陽營銷型網(wǎng)站建設(shè)，信陽網(wǎng)站制作、信陽網(wǎng)頁設(shè)計、信陽網(wǎng)站官網(wǎng)定制、微信小程序定制開發(fā)服務(wù)，打造信陽網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供信陽網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。

自己做點小程序的時候發(fā)現(xiàn)在一個標(biāo)簽中的不同兩個類給同一屬性設(shè)定了不同值的時候，最終屬性取值的特點：

上面這句話有夠拗口的，用例子說明一切吧。

csstest.html:

代碼如下:

<!DOCTYPE HTML>
<html>
<head>
<title>CSStest</title>
<link rel="stylesheet" href="1.css" />
<link rel="stylesheet" href="2.css" />
</head>
<body>

aaaaaaa
bbbbbbb
ccccccc
ddddddd
eeeeeee
fffffff
</body>
</html>

1.css

代碼如下:

.a{
cursor: pointer;
font-size: 1em;
}
.b{
cursor: move;
font-size: 2em;
}
.c{
cursor: crosshair;
font-size: 3em;
}
.d{
cursor: help;
font-size: 4em !important;
}

2.css

代碼如下:

.e{
cursor: progress;
font-size: 5em;
}

最后在瀏覽器審查元素的時候發(fā)現(xiàn)：

1、第一第二段落中，鼠標(biāo)樣式都為move，字體大小都為2em，僅類b發(fā)揮了作用。

則說明：無論在標(biāo)簽中class屬性里類的順序如何，最終相同的屬性值取css文件中聲明位置最后的那個。

2、第三第四段落中，鼠標(biāo)樣式都為progress，字體大小都5em，僅類e發(fā)揮了作用，而在加載html頁面的時候，先加載1.css，再加載2.css。

則說明：無論在標(biāo)簽中class屬性里類的順序如何，最終相同的屬性值取最后加載的css文件中聲明位置最后的那個。

3、第五第六段落中，鼠標(biāo)樣式都為progress，字體大小都4em，類e起效，類d由于設(shè)定了!important，也起效。

則說明：設(shè)定了!important的值會優(yōu)先被選取。

后來我又測試了一下，把e中的font-size也加上!important之后，字體大小會變?yōu)?em，則對于都設(shè)定了!important的屬性值來說，遵循上面的規(guī)律。

到此，關(guān)于“如何理解瀏覽器對于CSS不同類中的同屬性不同值優(yōu)先級問題”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識，請繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編會繼續(xù)努力為大家?guī)砀鄬嵱玫奈恼拢?/p>

分享名稱：如何理解瀏覽器對于CSS不同類中的同屬性不同值優(yōu)先級問題-創(chuàng)新互聯(lián)
標(biāo)題網(wǎng)址：http://www.rwnh.cn/article16/dsccdg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供移動網(wǎng)站建設(shè)、營銷型網(wǎng)站建設(shè)、做網(wǎng)站、外貿(mào)建站、標(biāo)簽優(yōu)化、域名注冊

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

如何理解瀏覽器對于CSS不同類中的同屬性不同值優(yōu)先級問題-創(chuàng)新互聯(lián)