css樣式層疊規(guī)則是什么-創(chuàng)新互聯(lián)

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

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

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

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

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

語法:

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

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

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

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

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

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

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

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

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

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

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

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

計算特指度:ICE  公式

1. 選擇符中有一個 ID,就在 I 的位置上加 1;

2. 選擇符中有一個類,就在 C 的位置上加 1;

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

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

好了,下面通過幾個例子來理韶特指度。

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

在此,每個選擇符都比前一個選擇符的特指度更高。

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 ;

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

文章名稱:css樣式層疊規(guī)則是什么-創(chuàng)新互聯(lián)
文章源于:http://www.muchs.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)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

網(wǎng)站優(yōu)化排名