css權(quán)重

lyning 發(fā)布于2019-08-30 15:55 / 2891人閱讀

摘要：什么是權(quán)重大基礎(chǔ)選擇器權(quán)重指的是大基礎(chǔ)選擇符的優(yōu)先級，優(yōu)先級高的樣式會覆蓋優(yōu)先級底的樣式，優(yōu)先級越高說明權(quán)重越高，反之亦然。

1、什么是css權(quán)重？css6大基礎(chǔ)選擇器

css權(quán)重指的是css6大基礎(chǔ)選擇符的優(yōu)先級，優(yōu)先級高的css樣式會覆蓋優(yōu)先級底的css樣式，優(yōu)先級越高說明權(quán)重越高，反之亦然。

css6大基礎(chǔ)選擇器：

a）、id選擇器(#box{})
b）、類選擇器(.box{})
c）、屬性選擇器(a[])
d）、偽類和偽對象選擇器(:hoevr{}和::after{})
e）、標(biāo)簽類型選擇器(div{})
f）、通配符選擇器(*{})

2、css權(quán)重計(jì)算規(guī)則

計(jì)算css權(quán)重是有一定規(guī)則的，根據(jù)w3c制定的css規(guī)范，css權(quán)重計(jì)算規(guī)則如下：

a）、計(jì)算選擇符中的id選擇器的數(shù)量
    一個(gè)id選擇器為一個(gè)a，一個(gè)a為100
    
b）、計(jì)算選擇符中的類選擇器、屬性選擇器以及偽類選擇器的數(shù)量
    一個(gè)類選擇器、屬性選擇器以及偽類選擇器為一個(gè)b，一個(gè)b為10
    
c）、計(jì)算標(biāo)簽類型選擇器和偽對象選擇器的數(shù)量
    一個(gè)標(biāo)簽類型選擇器、偽對象選擇器為一個(gè)c，一個(gè)c為1
    
d）、忽略通配符選擇器
    通配符選擇器忽略不計(jì)

如下面這張圖就是一個(gè)css選擇器權(quán)重的例子：

如果兩個(gè)選擇符的權(quán)重相同，則可依照”就進(jìn)原則”來判斷，最后定義的選擇符會被采用。但盡量避免出現(xiàn)這種依靠定義的順序決定選擇符優(yōu)先級的情況，因?yàn)樵诤罄m(xù)的維護(hù)中很難保證定義的順序不會被打亂。

云服務(wù)器 GPU云服務(wù)器權(quán)重域名低權(quán)重解析權(quán)重權(quán)重

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

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/117205.html

相關(guān)文章

CSS的低權(quán)重原則—避免濫用子選擇器

摘要：使用子選擇器，會增加選擇符的權(quán)重，的選擇符權(quán)重越高，樣式越不易被覆蓋，所以除非確定結(jié)構(gòu)非常穩(wěn)定，一定不會再修改了，否則盡量使用子選擇器。在進(jìn)過大量實(shí)踐后，我并不認(rèn)為多有太大的壞處，相反，與使用子選擇器相比，新添加反而跟利于維護(hù)。 CSS設(shè)置的樣式是可以層疊的，如下面[代碼1][代碼1] span{font-size: 40px;} .test{color:red;} ...

vslam 2019-08-30 12:57 評論0 收藏0
你對CSS權(quán)重真的足夠了解嗎？

摘要：如果兩個(gè)權(quán)重不同的選擇器作用在同一元素上，權(quán)重值高的規(guī)則生效選擇器可能會包含一個(gè)或者多個(gè)與權(quán)重相關(guān)的計(jì)算點(diǎn)，若經(jīng)過權(quán)重值計(jì)算得到的權(quán)重值越大，則認(rèn)為這個(gè)選擇器的權(quán)重高。前言 css權(quán)重很多人都聽過，也了解一些，但是很多人對具體的規(guī)則或者說再深如一些關(guān)于css權(quán)重的問題，可能會不那么清楚。日常開發(fā)中，或多或少都會遇到css規(guī)則不生效的問題，為了讓我們能夠減少調(diào)試css規(guī)則的時(shí)間，深刻理...

xioqua 2019-08-29 15:27 評論0 收藏0
前端雜談: CSS 權(quán)重 (Specificity)

摘要：前端雜談權(quán)重權(quán)重想必大家都聽說過一些簡單的規(guī)則大部分人也都知道較長的權(quán)重會大于較短的權(quán)重高于但是具體規(guī)范是什么瀏覽器是按照什么標(biāo)準(zhǔn)來判定不同選擇器的權(quán)重的呢讓我們來看一下官方文檔是怎么說的第一個(gè)關(guān)鍵詞官方文檔中用特異性來表示一個(gè)和其元素的相前端雜談: CSS 權(quán)重 (Specificity) css 權(quán)重想必大家都聽說過, 一些簡單的規(guī)則大部分人也都知道: 較長的 css sele...

SimonMa 2019-08-29 17:18 評論0 收藏0
CSS優(yōu)先級的及其衡量標(biāo)準(zhǔn)CSS權(quán)重

摘要：優(yōu)先級是由權(quán)重來作為衡量標(biāo)準(zhǔn)的，權(quán)重的計(jì)算有一套計(jì)算公式，有如下規(guī)范使用一個(gè)位數(shù)的字串來表示級別，從左到右，左邊的做大，往右依次遞減，且數(shù)位之間沒有進(jìn)制，級別之間不可逾越。定義了一個(gè)命令，該命令被賦予最大的優(yōu)先級。一、背景 CSS有三大特性：層疊性、繼承性、優(yōu)先級。而我們在給CSS定義樣式的時(shí)候，經(jīng)常出現(xiàn)兩個(gè)及以上的規(guī)則應(yīng)用在同一元素上，單該元素最終在瀏覽器呈現(xiàn)的效果是應(yīng)用的哪個(gè)規(guī)則呢？這...

ky0ncheng 2019-04-23 13:28 評論0 收藏0
link和@import的區(qū)別淺析

摘要：結(jié)論就結(jié)論而言，強(qiáng)烈建議使用標(biāo)簽，慎用方式。這樣可以避免考慮的語法規(guī)則和注意事項(xiàng)，避免產(chǎn)生資源文件下載順序混亂和請求過多的煩惱。區(qū)別從屬關(guān)系區(qū)別是提供的語法規(guī)則，只有導(dǎo)入樣式表的作用是提供的標(biāo)簽，不僅可以加載文件，還可以定義連接屬性等。我們都知道，外部引入 CSS 有2種方式，link標(biāo)簽和@import。它們有何本質(zhì)區(qū)別，有何使用建議，在考察外部引入 CSS 這部分內(nèi)容時(shí)，經(jīng)常被提...

YFan 2019-08-29 16:19 評論0 收藏0
link和@import的區(qū)別淺析

摘要：結(jié)論就結(jié)論而言，強(qiáng)烈建議使用標(biāo)簽，慎用方式。這樣可以避免考慮的語法規(guī)則和注意事項(xiàng)，避免產(chǎn)生資源文件下載順序混亂和請求過多的煩惱。區(qū)別從屬關(guān)系區(qū)別是提供的語法規(guī)則，只有導(dǎo)入樣式表的作用是提供的標(biāo)簽，不僅可以加載文件，還可以定義連接屬性等。我們都知道，外部引入 CSS 有2種方式，link標(biāo)簽和@import。它們有何本質(zhì)區(qū)別，有何使用建議，在考察外部引入 CSS 這部分內(nèi)容時(shí)，經(jīng)常被提...

cgh1999520 2019-08-23 10:53 評論0 收藏0