css樣式有哪幾種選擇器

CSS選擇器、優(yōu)先級與匹配原理

成都創(chuàng)新互聯(lián)是一家專業(yè)提供羅定企業(yè)網(wǎng)站建設(shè),專注與成都做網(wǎng)站、成都網(wǎng)站制作、成都外貿(mào)網(wǎng)站建設(shè)、成都h5網(wǎng)站建設(shè)、小程序制作等業(yè)務。10年已為羅定眾多企業(yè)、政府機構(gòu)等服務。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站設(shè)計公司優(yōu)惠進行中。

1.id 選擇器（#myid）2.類選擇器（.myclassname）3.標簽選擇器（div,h1,p）4.相鄰選擇器（h1+p）5.子選擇器（ul li）6.后代選擇器（li a）7.通配符選擇器（*）8.屬性選擇器（a[rel="external"]）9.偽類選擇器（a:hover,li:nth-child）

其中ID選擇器的效率是最高，而偽類選擇器的效率則是最低

CSS的權(quán)重

1. 通配選擇符的權(quán)值 0,0,0,0

2. 標簽的權(quán)值為 0,0,0,1

3. 類的權(quán)值為 0,0,1,0

4. 屬性選擇的權(quán)值為 0,0,1,0

5. 偽類選擇的權(quán)值為 0,0,1,0

6. 偽對象選擇的權(quán)值為 0,0,0,1

7. ID的權(quán)值為 0,1,0,0

8. important的權(quán)值為最高 1,0,0,0

使用規(guī)則： 選擇器的權(quán)值加到一起，大的優(yōu)先；如果權(quán)值相同，后定義的優(yōu)先 。

從上面我們可以得出兩個關(guān)鍵的因素：

1. 權(quán)值的大小跟選擇器的類型和數(shù)量有關(guān)

2. 樣式的優(yōu)先級跟樣式的定義順序有關(guān)

css定義的權(quán)重 面試時怎么回答

CSS選擇器的權(quán)重與優(yōu)先規(guī)則

我們在使用CSS對網(wǎng)頁元素定義樣式時經(jīng)常會遇到這種情況：要對一般元素應用一般樣式，然后在更特殊的元素上覆蓋它們。那么我們怎么樣來保證我們所新定義的元素樣式能覆蓋目標元素上原有的樣式呢？

在CSS中，會根據(jù)選擇器的特殊性來決定所定義的樣式規(guī)則的次序，具有更特殊選擇器的規(guī)則優(yōu)先于具有一般選擇器的規(guī)則，如果兩個規(guī)則的特殊性相同，那么后定義的規(guī)則優(yōu)先。

那么，又怎么來計算選擇器的特殊性呢？下面這張圖介紹了特殊性的計算方法：

我們把特殊性分為4個等級，每個等級代表一類選擇器，每個等級的值為其所代表的選擇器的個數(shù)乘以這一等級的權(quán)值，最后把所有等級的值相加得出選擇器的特殊值。

4個等級的定義如下：

第一等：代表內(nèi)聯(lián)樣式，如: style=””，權(quán)值為1000。

第二等：代表ID選擇器，如：#content，權(quán)值為100。

第三等：代表類，偽類和屬性選擇器，如.content，權(quán)值為10。

第四等：代表類型選擇器和偽元素選擇器，如div p，權(quán)值為1。

例如上圖為例，其中#NAV為二等選擇器，.ACTIVE為三等選擇器，UL、LI和A為四等選擇器。則整個選擇器表達式的特殊性的值為1*100+1*10+3*1=113

下面是一些計算示例：

注意：通用選擇器（*），子選擇器（）和相鄰同胞選擇器（+）并不在這四個等級中，所以他們的權(quán)值都為0。

理解選擇器的特殊性很重要，特別是在修復bug的時候，因為你需要了解哪些規(guī)則優(yōu)先及其原因。

如果你遇到了似乎沒有起作用的CSS規(guī)則，很可能是出現(xiàn)了特殊性沖突。請在你的選擇器中添加他的一個父元素的ID，從而提高它的特殊性。如果這能解決問題，就說明樣式表中其他地方很可能有更特殊的規(guī)則，它覆蓋了你的規(guī)則。如果是這種情況，你可能需要檢查代碼，解決特殊性沖突，讓代碼盡可能簡潔。

css規(guī)則按選擇器類型分為哪四種？

1、代表內(nèi)聯(lián)樣式，如: style=””，權(quán)值為1000。

2、代表ID選擇器，如：#content，權(quán)值為100。

3、代表類，偽類和屬性選擇器，如.content，權(quán)值為10。

4、代表類型(元素)選擇器和偽元素選擇器，如div p，權(quán)值為1。

按照CSS代碼的執(zhí)行先后順序。如果有重復的規(guī)則，按照后執(zhí)行的定義。最終規(guī)則是多個定義規(guī)則的綜合。重點：高級規(guī)則定義對于不同表格的文字樣式定義。(不同表格使用不同ID、使用類樣式定義)一頁中的多種超級鏈接樣式定義。多個相同規(guī)則不同對象的CSS共同定義。對于同一對象定義的多種CSS方式考慮哪種更科學。

css類是權(quán)值靠前還是就近原則靠前

正常情況下是就近原則，css從上直下，如果相同會采用最后的css，如果是css3就要看情況了。

比如：如果設(shè)置了【：first-child或者：last-child，：nth-child()】等這種選擇器，會采用選擇器的css；如果設(shè)置了【！important】會采用有這個的css，就算是寫在div里面的也沒有這個級別高（但不是萬能的，有的可以設(shè)置有的不行，列出來太多了，記著也麻煩，最簡單的記憶方式就是寫完在瀏覽器中F12，如果劃橫線就是不好使）

width：10px ！important；意思是設(shè)置成最高級別，不管先后都會采用這個css，如果有兩個這種代碼會采用最后一個。

以下是優(yōu)先級設(shè)置順序：

1、width：10px；

2、width：10px ！important；

3、：first-child{width：10px；}

4、：first-child{width：10px ！important；}

優(yōu)先級順序為4231，如果是同級別情況下會就近選擇，就是選擇最后一個

CSS權(quán)值是怎樣的?怎樣打破這樣規(guī)律?

1. 內(nèi)聯(lián)樣式表的權(quán)值最高 1000

2. ID 選擇器的權(quán)值為 100

3. Class 類選擇器的權(quán)值為 10

4. HTML 標簽選擇器的權(quán)值為 1

CSS 優(yōu)先級法則：

A 選擇器都有一個權(quán)值，權(quán)值越大越優(yōu)先

B 當權(quán)值相等時，后出現(xiàn)的樣式表設(shè)置要優(yōu)于先出現(xiàn)的樣式表設(shè)置

C 創(chuàng)作者的規(guī)則高于瀏覽者：即網(wǎng)頁編寫者設(shè)置的CSS 樣式的優(yōu)先權(quán)高于瀏覽器所設(shè)置的樣式

D 繼承的CSS 樣式不如后來指定的CSS 樣式

E 在同一組屬性設(shè)置中標有“!important”規(guī)則的優(yōu)先級最大

這是規(guī)定好的,自然不能打破

分享題目：css樣式權(quán)值,css中樣式
鏈接分享：http://www.chinadenli.net/article6/dscohog.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站策劃、Google、動態(tài)網(wǎng)站、網(wǎng)站排名、商城網(wǎng)站、全網(wǎng)營銷推廣

廣告

聲明：本網(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)