少妇精品久久久一区二区三区,色哟哟亚洲精品一区二区,亚洲男人天堂九九视频,都市激情国产精品

全美商學(xué)院
新聞
新聞

成都小程序設(shè)計(jì)告訴您什么是CSS特異性及其工作原理?

2023
01/28
22:46
全美網(wǎng)絡(luò)官網(wǎng)
分享

假設(shè)您正在與成都小程序設(shè)計(jì)合作建設(shè)一個(gè)網(wǎng)站并希望所有超鏈接都是橙色的,以便從頁(yè)面上的其他文本中脫穎而出。此外,對(duì)于內(nèi)部鏈接,您不僅要更改字體顏色——您還想將它們加粗以額外強(qiáng)調(diào)。

網(wǎng)站設(shè)計(jì)

為此,您需要添加針對(duì)所有鏈接元素和專(zhuān)門(mén)包含您的網(wǎng)站名稱(chēng)的鏈接元素(這些是您的內(nèi)部鏈接)的CSS選擇器。但是,當(dāng)您預(yù)覽站點(diǎn)的前端時(shí),您看不到內(nèi)部鏈接的正確格式。這是怎么回事?

您可能違反了CSS特異性規(guī)則之一,因此將不得不回溯您的代碼以嘗試修復(fù)錯(cuò)誤。這很痛苦,但很常見(jiàn)。CSS特異性是在CSS和Bootstrap等框架中學(xué)習(xí)的最困難但最重要的概念之一。

什么是CSS的特殊性?

在CSS中,特異性是基于文檔中CSS選擇器的類(lèi)型和順序的相關(guān)性度量。如果一個(gè)HTML元素或一組元素被多個(gè)CSS選擇器作為目標(biāo),CSS特異性規(guī)則會(huì)告訴 Web 瀏覽器應(yīng)該應(yīng)用哪些CSS聲明。

在我們查看CSS特異性的不同規(guī)則之前,讓我們定義每種CSS選擇器的特異性級(jí)別。下面是“特異性層次結(jié)構(gòu)”,它列出了從最高特異性到最低特異性的選擇器類(lèi)型。

ID 選擇器: ID 選擇器是最具體的一種選擇器。他們根據(jù)元素的ID 屬性(例如,#my-id)選擇元素。

類(lèi)選擇器、屬性選擇器和偽類(lèi)選擇器:這三種選擇器類(lèi)型具有相同的特異性。

類(lèi)選擇器選擇CSS類(lèi)中的所有元素(例如,.my-class)。

屬性選擇器選擇具有給定屬性的所有元素(例如,p[target])。

偽類(lèi)選擇器僅在處于特殊狀態(tài)時(shí)才選擇元素,例如已訪問(wèn)或懸停(例如,button:hover)。

類(lèi)型選擇器:這些選擇器選擇所有具有給定節(jié)點(diǎn)名稱(chēng)和語(yǔ)法元素(例如,div)的HTML元素。

通用選擇器:通用選擇器 ( * ) 對(duì)特異性沒(méi)有影響。

CSS特異性規(guī)則

在開(kāi)始編寫(xiě)CSS之前,您應(yīng)該了解一些CSS特性規(guī)則。

規(guī)則 1:應(yīng)用具有更高特異性的CSS選擇器。

如果一個(gè)HTML元素被多個(gè)選擇器定位,那么瀏覽器將應(yīng)用具有最高特異性的選擇器的CSS規(guī)則。

例如,一個(gè)段落元素是 ID 選擇器和類(lèi)選擇器的目標(biāo)。因?yàn)镮D選擇器具有更高的特異性,所以屬于ID選擇器的CSS樣式會(huì)比類(lèi)選擇器更適用于元素。

讓我們看另一個(gè)例子:假設(shè)您希望整個(gè)網(wǎng)站的所有按鈕都是藍(lán)色的。您將添加一個(gè)類(lèi)選擇器以將按鈕類(lèi)下的所有元素定義為具有藍(lán)色背景色。

但是,如果您希望主頁(yè)上的訂閱按鈕是一個(gè)例外,以便更加醒目,您可以使用 ID 選擇器將 ID 為“主頁(yè)”的按鈕定義為橙色背景色。所有沒(méi)有 ID “homepage” 的按鈕仍將遵循類(lèi)選擇器的CSS規(guī)則。

規(guī)則 2:如果CSS選擇器具有相同的特異性,則應(yīng)用文檔中的最后一條規(guī)則。

如果多個(gè)選擇器應(yīng)用于同一個(gè)HTML元素并且它們具有相同級(jí)別的特異性(例如,類(lèi)選擇器和屬性選擇器),那么瀏覽器將應(yīng)用樣式表中最后出現(xiàn)的選擇器的CSS規(guī)則。

以上面的例子為例,假設(shè)您有兩個(gè)按鈕聲明塊,并且都使用按鈕類(lèi)。第二個(gè)聲明塊將適用,因?yàn)樗俏臋n中的最后一個(gè)聲明塊。

規(guī)則 3:內(nèi)聯(lián)CSS具有最高的特異性。

CSS可以用三種方式編寫(xiě):內(nèi)聯(lián)、在HTML文檔中的

總的來(lái)說(shuō),成都小程序設(shè)計(jì)使用CSS特異性決定哪個(gè)CSS規(guī)則應(yīng)該被應(yīng)用到元素上的關(guān)鍵因素。理解這個(gè)概念對(duì)于編寫(xiě)有效的CSS代碼非常重要。

聯(lián)系我們
歡迎來(lái)到全美,免費(fèi)
獲取專(zhuān)業(yè)小程序設(shè)計(jì)方案
電話(huà)咨詢(xún):

15281067168

您還可以預(yù)約資深顧問(wèn)
隱私信息保護(hù)中,請(qǐng)放心填寫(xiě)

在線(xiàn)客服

電話(huà)咨詢(xún)

微信咨詢(xún)

微信號(hào)復(fù)制成功
15281067168 (蘇女士)
打開(kāi)微信,粘貼添加好友,免費(fèi)詢(xún)價(jià)吧
主站蜘蛛池模板: 桐庐县| 花莲市| 乌拉特前旗| 喀喇| 温宿县| 黔江区| 嵊州市| 龙口市| 沾化县| 正镶白旗| 抚宁县| 夹江县| 海伦市| 寿光市| 库车县| 克什克腾旗| 正蓝旗| 广东省| 五峰| 赤城县| 邹平县| 长沙县| 永昌县| 龙游县| 牡丹江市| 正定县| 泗洪县| 湘潭县| 永安市| 福州市| 淮南市| 肇东市| 丰镇市| 麻阳| 雷山县| 东乡县| 鞍山市| 洛浦县| 陇川县| 瑞金市| 游戏|