成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

前端面試題-CSS優(yōu)先級

余學(xué)文 / 1131人閱讀

摘要：優(yōu)先級是基于不同種類選擇器組成的匹配規(guī)則。但是，在內(nèi)部聲明的選擇器是會影響優(yōu)先級。當(dāng)兩條相互沖突的帶有規(guī)則的聲明被應(yīng)用到相同的元素上時，擁有更大優(yōu)先級的聲明將會被采用。擴展閱讀前端面試題選擇器

一、選擇器優(yōu)先級 
瀏覽器通過優(yōu)先級來判斷哪一些屬性值與一個元素最為相關(guān)，從而在該元素上應(yīng)用這些屬性值。優(yōu)先級是基于不同種類選擇器組成的匹配規(guī)則。
二、優(yōu)先級計算

優(yōu)先級就是分配給指定的CSS聲明的一個權(quán)重，它由匹配的選擇器中的每一種選擇器類型的 數(shù)值 決定。

而當(dāng)優(yōu)先級與多個CSS聲明中任意一個聲明的優(yōu)先級相等的時候，CSS中最后的那個聲明將會被應(yīng)用到元素上。

當(dāng)同一個元素有多個聲明的時候，優(yōu)先級才會有意義。因為每一個直接作用于元素的CSS規(guī)則總是會接管/覆蓋（take over）該元素從祖先元素繼承而來的規(guī)則。

三、優(yōu)先級順序 3.1 選擇器權(quán)重值

3.2 從大到小

內(nèi)聯(lián)樣式 > ID 選擇器 > 類選擇器 = 屬性選擇器 = 偽類選擇器 > 元素（類型）選擇器 = 偽元素選擇器

3.2 注意

通配選擇符（universal selector）(*), 關(guān)系選擇符（combinators） (+, >, ~, " ") 和 否定偽類（negation pseudo-class）(:not()) 對優(yōu)先級沒有影響。（但是，在 :not() 內(nèi)部聲明的選擇器是會影響優(yōu)先級）。

四、特殊的 !important 規(guī)則 4.1 說明

當(dāng)在一個樣式聲明中使用一個 !important 規(guī)則時，此聲明將覆蓋任何其他聲明。雖然技術(shù)上 !important 與優(yōu)先級無關(guān)，但 !important 卻又與 CSS 優(yōu)先級直接相關(guān)。

4.2 破壞級聯(lián)規(guī)則

使用 !important 是一個壞習(xí)慣，應(yīng)該盡量避免，因為這破壞了樣式表中的固有的級聯(lián)規(guī)則 使得調(diào)試找 bug 變得更加困難了。當(dāng)兩條相互沖突的帶有 !important 規(guī)則的聲明被應(yīng)用到相同的元素上時，擁有更大優(yōu)先級的聲明將會被采用。

擴展閱讀 前端面試題-CSS選擇器

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/115809.html

相關(guān)文章

  • 前端面試題-CSS優(yōu)先級

    摘要：優(yōu)先級是基于不同種類選擇器組成的匹配規(guī)則。但是，在內(nèi)部聲明的選擇器是會影響優(yōu)先級。當(dāng)兩條相互沖突的帶有規(guī)則的聲明被應(yīng)用到相同的元素上時，擁有更大優(yōu)先級的聲明將會被采用。擴展閱讀前端面試題選擇器 一、選擇器優(yōu)先級 瀏覽器通過優(yōu)先級來判斷哪一些屬性值與一個元素最為相關(guān)，從而在該元素上應(yīng)用這些屬性值。優(yōu)先級是基于不同種類選擇器組成的匹配規(guī)則。 二、優(yōu)先級計算 優(yōu)先級就是分配給指定的CSS聲明...

    zorro 評論0 收藏0

  • 前端面試題：CSS中的選擇器權(quán)重

    摘要：第二等代表選擇器，如，權(quán)值為。第三等代表類，偽類和屬性選擇器，如，權(quán)值為。第五等通配符子選擇器相鄰選擇器等的。第六等繼承的樣式?jīng)]有權(quán)值。 CSS中選擇器優(yōu)先級的權(quán)重計算 先看一段代碼，如下： a{ color: red; } #box a{ color: green; } [class=box] a{ c...

    cppprimer 評論0 收藏0

  • 前端 CSS 面試大綱

    摘要：比如說預(yù)處理器，組件化，工程化，兼容性處理等方面，這些主要是基于自己的開發(fā)經(jīng)驗業(yè)界流行技術(shù)方案進行準(zhǔn)備。但是在開始談面試前我想先提出一個概念學(xué)霸面試模型學(xué)校的學(xué)習(xí)和公司的工作有很多相似的地方。所以對于面試，請參考上學(xué)那會兒你們班學(xué)霸的姿勢。 背景 參加完 廈門第四屆CSS Conf 后，讓我對 CSS 產(chǎn)生了新的思考。CSS 是前端必須熟練掌握并保持持續(xù)關(guān)注的技術(shù)，但是我又不想在 CS...

    mating 評論0 收藏0

  • 前端面試題-CSS選擇器性能優(yōu)化

    摘要：不要在編寫規(guī)則時用標(biāo)簽名或類名不要在編寫規(guī)則時用標(biāo)簽名把多層標(biāo)簽選擇規(guī)則用規(guī)則替換，減少查找避免使用子選擇器后代選擇器在中是最昂貴的選擇器。如果你關(guān)心頁面性能的話，他們真不該被使用擴展閱讀前端面試題選擇器前端面試題優(yōu)先級 一、CSS選擇符 CSS選擇符由一些初始化參數(shù)組成，這些參數(shù)指明了要應(yīng)用這個CSS規(guī)則的頁面元素。 作為一個網(wǎng)站的前端開發(fā)工程師，應(yīng)該避免編寫一些常見的開銷很大的CS...

    Scott 評論0 收藏0

  • 前端面試題-CSS選擇器性能優(yōu)化

    摘要：不要在編寫規(guī)則時用標(biāo)簽名或類名不要在編寫規(guī)則時用標(biāo)簽名把多層標(biāo)簽選擇規(guī)則用規(guī)則替換，減少查找避免使用子選擇器后代選擇器在中是最昂貴的選擇器。如果你關(guān)心頁面性能的話，他們真不該被使用擴展閱讀前端面試題選擇器前端面試題優(yōu)先級 一、CSS選擇符 CSS選擇符由一些初始化參數(shù)組成，這些參數(shù)指明了要應(yīng)用這個CSS規(guī)則的頁面元素。 作為一個網(wǎng)站的前端開發(fā)工程師，應(yīng)該避免編寫一些常見的開銷很大的CS...

    XGBCCC 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<