這篇文章主要講解了“CSS中:where和:is偽類函數(shù)的介紹”，文中的講解內(nèi)容簡單清晰，易于學(xué)習(xí)與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學(xué)習(xí)“CSS中:where和:is偽類函數(shù)的介紹”吧！

超過十余年行業(yè)經(jīng)驗，技術(shù)領(lǐng)先，服務(wù)至上的經(jīng)營模式，全靠網(wǎng)絡(luò)和口碑獲得客戶，為自己降低成本，也就是為客戶降低成本。到目前業(yè)務(wù)范圍包括了：成都網(wǎng)站制作、網(wǎng)站設(shè)計，成都網(wǎng)站推廣，成都網(wǎng)站優(yōu)化，整體網(wǎng)絡(luò)托管，小程序定制開發(fā)，微信開發(fā)，app軟件開發(fā)，同時也可以讓客戶的網(wǎng)站和網(wǎng)絡(luò)營銷和我們一樣獲得訂單和生意！

什么是 :is 與 :where?

:is() 和 :where()  都是偽類函數(shù)，可以幫助縮短和停止創(chuàng)建選擇器時的重復(fù)。它們都接受選擇器的參數(shù)數(shù)組(id，類，標簽等)，并選擇可以在該列表中選擇的任何元素。

這對如何幫助我們編寫更短的選擇器可能沒有多大意義，所以讓我們嘗試使用 :where() 和 :is() 。

如何使用 :is 與 :where?

:where() 可以幫助我們解決類似這樣的問題：

.btn span > a:hover, #header span > a:hover, #footer span > a:hover {    ... }

變成這樣的東西

:where(.btn, #header, #footer) span > a:hover {    ...  }

和 :is() 可以幫助將相同的示例添加到該示例中。

:is 與 :where 和有什么不一樣?

:where() 和 :is() 看起來和功能都是一樣的，但是它們之間有一個區(qū)別要記住，那就是它們有不同的特殊性。:where()  是簡單的，其特異性總是為0，而 :is() 的特異性為最強的選擇器。

什么是CSS特異性(簡而言之)?

在CSS中有四個層次的特異性層次。每一個級別或類別都有不同的分數(shù)，我們可以將所有的分數(shù)相加來計算選擇器的特異性。

哪個選擇器的數(shù)量最多，哪個元素的樣式就會被應(yīng)用到該元素上，這就是為什么有時當你寫CSS時，你的樣式不會被應(yīng)用，會在開發(fā)工具中顯示為劃線。

特異性等級評分：

• ID——特異性得分為 100

• 內(nèi)聯(lián)樣式——特異性得分為 1000

• 元素和偽類——特異性得分為 1

• 類、偽類和屬性——特異性得分為 10 例如

例如：

button.btn {   color: red; } .btn {   color: green; } .btn = 10  button.btn = 1 + 10 = 11

如果我們把 .btn 類放在標簽上，文字就會變成紅色，因為 button.btn 選擇器的分數(shù)高于 .btn 選擇器。

感謝各位的閱讀，以上就是“CSS中:where和:is偽類函數(shù)的介紹”的內(nèi)容了，經(jīng)過本文的學(xué)習(xí)后，相信大家對CSS中:where和:is偽類函數(shù)的介紹這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是創(chuàng)新互聯(lián)，小編將為大家推送更多相關(guān)知識點的文章，歡迎關(guān)注！

本文標題：CSS中:where和:is偽類函數(shù)的介紹
URL地址：http://weahome.cn/article/jpjoch.html