小編給大家分享一下css樣式層疊規(guī)則是什么，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

從策劃到設(shè)計(jì)制作，每一步都追求做到細(xì)膩，制作可持續(xù)發(fā)展的企業(yè)網(wǎng)站。為客戶提供成都網(wǎng)站設(shè)計(jì)、網(wǎng)站制作、網(wǎng)站策劃、網(wǎng)頁(yè)設(shè)計(jì)、域名注冊(cè)、網(wǎng)頁(yè)空間、網(wǎng)絡(luò)營(yíng)銷、VI設(shè)計(jì)、 網(wǎng)站改版、漏洞修補(bǔ)等服務(wù)。為客戶提供更好的一站式互聯(lián)網(wǎng)解決方案,以客戶的口碑塑造優(yōu)易品牌,攜手廣大客戶,共同發(fā)展進(jìn)步。

CSS樣式規(guī)則語(yǔ)法樣式是CSS的基本單位，每個(gè)樣式規(guī)則都是由選擇器和聲明塊兩個(gè)基本部分組成的。

選擇器（selector）決定為哪些元素應(yīng)用樣式；

聲明塊定義相應(yīng)的樣式，它包含在一對(duì)花括號(hào)內(nèi)，有一條或多條聲明組成，而每一條聲明則由一個(gè)屬性和一個(gè)值組成，中間用冒號(hào)隔開。

語(yǔ)法：

屬性名1: 屬性值1;
屬性名2: 屬性值2;
屬性名3: 屬性值3;

1.找到應(yīng)用給每個(gè)元素和屬性的所有聲明

瀏覽器在 加載每個(gè)頁(yè)面時(shí)。都會(huì)據(jù)此查到每一條CSS規(guī)則，表示出所有受到影響的HTML元素

2.按照順序和權(quán)重排序

瀏覽器依次檢查 5個(gè)來(lái)源 ，并設(shè)定匹配的屬性。如果匹配的屬性在下一個(gè)來(lái)源也有定義，則更新該屬性的值。

5個(gè)來(lái)源: 1.瀏覽器默認(rèn)樣式表 2.設(shè)置瀏覽器字體大小來(lái)改變默認(rèn)樣式 3.link引用的css文件 4.style中編寫的樣式代碼 5.行內(nèi)樣式

聲明權(quán)重。如下！important用于增加聲明的權(quán)重。這樣其他來(lái)源一概不用考慮了。

      p {color:green !important; font-size:12pt;}

順序決定權(quán)重。如果兩條規(guī)則都影響某元素的同一個(gè)屬性，而且它們的特指度也相同，則位置最靠下（或后聲明）的規(guī)則勝出。

3.按特指度排序:特指度表示一條規(guī)則有多明確

    p {font-size:12px;}     p.largetext {font-size:16px;} 

第二條既有標(biāo)簽名又有類名所以特指度更高，第二條的規(guī)則會(huì)覆蓋第一條規(guī)則。

計(jì)算特指度：ICE  公式

1. 選擇符中有一個(gè) ID，就在 I 的位置上加 1;

2. 選擇符中有一個(gè)類，就在 C 的位置上加 1;

3. 選擇符中有一個(gè)元素（標(biāo)簽）名，就在 E 的位置上加 1;

4. 得到一個(gè)三位數(shù)。

好了，下面通過(guò)幾個(gè)例子來(lái)理韶特指度。

P 0-0-1 特指度=1

p.largetext 0-1-1 特指度=11

p#largetext 1-0-1 特指度=101

body p#largetext 1-0-2 特指度=102

body p#largetext ul.mylist 1-1-3 特指度=113 body p#largetext ul.mylist li 1-1-4

特指度=114

在此，每個(gè)選擇符都比前一個(gè)選擇符的特指度更高。

4.CSS選擇符有哪些？哪些屬性可以繼承？

1.id選擇器（ # myid）

2.類選擇器（.myclassname）

3.標(biāo)簽選擇器（div, h2, p）

4.相鄰選擇器（h2 + p）

5.子選擇器（ul > li）

6.后代選擇器（li a）

7.通配符選擇器（ * ）

8.屬性選擇器（a[rel = "external"]）

9.偽類選擇器（a:hover, li:nth-child）

* 可繼承的樣式： font-size font-family color, UL LI DL DD DT;

* 不可繼承的樣式：border padding margin width height ;

看完了這篇文章，相信你對(duì)“css樣式層疊規(guī)則是什么”有了一定的了解，如果想了解更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

文章名稱：css樣式層疊規(guī)則是什么-創(chuàng)新互聯(lián)
文章源于：http://vcdvsql.cn/article40/djhpho.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供ChatGPT、網(wǎng)站排名、定制開發(fā)、服務(wù)器托管、做網(wǎng)站、手機(jī)網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)