溫馨提示×
您好，登錄后才能下訂單哦！
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶(hù)服務(wù)條款》
您好，登錄后才能下訂單哦！
這篇文章主要為大家展示了“CSS中級(jí)聯(lián)和繼承的示例分析”，內(nèi)容簡(jiǎn)而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“CSS中級(jí)聯(lián)和繼承的示例分析”這篇文章吧。
1.在HTML中使用CSS樣式表的三種方式：
?。?）內(nèi)聯(lián)的樣式表。
eg：<em style="background-white">LIN</em>
?。?）嵌入式樣式表。
即在<head>標(biāo)簽內(nèi)嵌入<style>標(biāo)簽及具體的樣式設(shè)置內(nèi)容。
?。?）外部鏈接的樣式表。
2.級(jí)聯(lián)的順序
?。?）
首先要根據(jù)起源（origin）將規(guī)則分類(lèi)。
具體優(yōu)先順序如下：
頁(yè)面作者（author）設(shè)置的規(guī)則 > 用戶(hù)（user）規(guī)則 > 瀏覽器（browser）規(guī)則
?。?）
然后是基于選擇符和特殊性的規(guī)則排序：
1.內(nèi)聯(lián)樣式表的優(yōu)先級(jí)最高。
2.id選擇符，當(dāng)有多個(gè)id選擇符時(shí)，具有id選擇符多的規(guī)則勝出。
3.如果沒(méi)有id選擇符，或者數(shù)量相同，那么規(guī)則中有最多類(lèi)或偽類(lèi)的規(guī)則有較高優(yōu)先級(jí)。
4.如果類(lèi)（或是沒(méi)有類(lèi)），那么規(guī)則中有最多元素?cái)?shù)量的，優(yōu)先級(jí)較高。
5.如果id，class，和元素?cái)?shù)量都相同，則最近聲明的原則有最高優(yōu)先級(jí)。
（3）嵌入式樣式表和外部鏈接樣式表的優(yōu)先級(jí)，當(dāng)其他權(quán)重相當(dāng)時(shí)，最近聲明的規(guī)則優(yōu)先級(jí)高。
即<head>標(biāo)簽中，link標(biāo)簽與style標(biāo)簽的先后順序，第二個(gè)聲明的優(yōu)先級(jí)高。
3.級(jí)聯(lián)和HTML屬性
HTML中的align，color，face，vlink，background也會(huì)影響頁(yè)面的外觀。
<img> 標(biāo)簽的 align 屬性定義了圖像相對(duì)于周?chē)氐乃胶痛怪睂?duì)齊方式。
HTML 4.01 不推薦使用 align 屬性，XHTML 1.0 Strict DTD 不支持該屬性，同時(shí) HTML 5 也不再支持該屬性。
color 屬性規(guī)定 font 元素中文本的顏色。
在 HTML 4.01 中，不贊成使用 font 元素的 color 屬性；在 XHTML 1.0 Strict DTD 中，不支持 font 元素的 color 屬性。
請(qǐng)使用 CSS 代替。
CSS 語(yǔ)法：<p style="color:red">
[
<font> 規(guī)定文本的字體、字體尺寸、字體顏色。
eg:This is some text!
This is some text!
This is some text!
在 HTML 4.01 中，font 元素不被贊成使用。
在 XHTML 1.0 Strict DTD 中，font 元素不被支持。
]
face 屬性規(guī)定 font 元素中文本的字體。
eg:<font >This is some text!</font>
在 HTML 4.01 中，不贊成使用 font 元素的 face 屬性；在 XHTML 1.0 Strict DTD 中，不支持 font 元素的 face 屬性。
請(qǐng)使用 CSS 代替。
CSS 語(yǔ)法：<p style="font-family: verdana">
vlink 屬性文檔中已被訪問(wèn)鏈接的顏色。
eg：<body >
在 HTML 4.01 中，不贊成使用 body 元素的 vlink 屬性；在 XHTML 1.0 Strict DTD 中，不支持 body 元素的 vlink 屬性。
請(qǐng)使用 CSS 代替。
CSS 語(yǔ)法（在 <head> 部分）：<style>a:visited {color: #FF0000}</style>
這些屬性與css規(guī)則相沖突時(shí)，總是被css規(guī)則覆蓋。
4.在規(guī)則中使用！important
用！important 指定的規(guī)則比其他規(guī)則都重要。
eg： em { color ：bule ！important；}
注意：用戶(hù)首創(chuàng)的！important規(guī)則優(yōu)先于作者的規(guī)則。
用戶(hù)定義的樣式表應(yīng)該聲明是！important。
5. @import規(guī)則，導(dǎo)入文件。
eg：h2 {color：red；}
@import url（“style.css”）;
h2{color：green；}
以上代碼，最終h2為紅色。因?yàn)槟J(rèn)使用導(dǎo)入的樣式表出現(xiàn)在原始樣式表規(guī)則之前。
6.繼承
?。?）注意display，border，margin，padding屬性是不繼承的。
?。?）background-color不是繼承，在沒(méi)有設(shè)置時(shí)，它的默認(rèn)值是特別值transparent。
?。?）繼承相對(duì)值時(shí)，在傳遞給子代之前，首先計(jì)算該值。
?。?）指定繼承：inherit特殊值
eg：div .standout{ border :1px solid blue ;}
div .standout{ border:inhert;}
注意：css 1發(fā)行時(shí)，作者的！important樣式優(yōu)先于用戶(hù)的！important樣式。
css2中，用戶(hù)的！important樣式優(yōu)先于作者的！important樣式。
以上是“CSS中級(jí)聯(lián)和繼承的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！
免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。
億速云公眾號(hào)
手機(jī)網(wǎng)站二維碼
