css詳解之選擇符、優(yōu)先級(jí)及繼承關(guān)系
2023-05-20 分類： 網(wǎng)站建設(shè)
選擇符
1、通配符
語(yǔ)法：*{屬性：屬性值；}
說(shuō)明：通配選擇符的寫法是“*”，其含義就是所有元素。
用法：常用于定義文檔中各種元素得共同屬性，如字號(hào)、字體等。
使用通配選擇符的一個(gè)示例如下：
*{font-size:12px;}
說(shuō)明：font-size屬性是字體的大小、px是像素，該樣式實(shí)現(xiàn)的效果是：頁(yè)面中所有文本的字體大小為12個(gè)像素 。
2、類型選擇符
語(yǔ)法：元素名稱{屬性：屬性值；}
說(shuō)明：1)類型選擇符就是以文檔語(yǔ)言對(duì)象類型作為選擇符，即使用結(jié)構(gòu)中元素名稱作為選擇符。例如body、div、p等。
2) 所有的頁(yè)面元素都可以作為類型選擇符。
用法：1)如果想改變某個(gè)元素得默認(rèn)樣式時(shí)，可以使用類型選擇符；
例：ul{margin:0;
list-style:none; }
2) 當(dāng)統(tǒng)一文檔某個(gè)元素的顯示效果時(shí)，可以使用類型選擇符；
例：body{font-size:12px;
line-height;18px;}
3、Id選擇符
語(yǔ)法：#id名{屬性：屬性值；}
應(yīng)用：<元素名稱id=“id選擇符名稱"></元素名稱
說(shuō)明：1)ID選擇符的語(yǔ)法格式是“#”加上自定義的ID名稱。
2)當(dāng)我們使用ID選擇符時(shí)，應(yīng)先為每個(gè)元素定義一個(gè)id屬性，如：<div id="top"></div>
3) 一個(gè)id名稱只能對(duì)應(yīng)于文檔中一個(gè)具體得元素對(duì)象，因?yàn)閕d只能定義頁(yè)面中某一個(gè)唯一的元素對(duì)象；
用法：1)用來(lái)構(gòu)建整體結(jié)構(gòu)的元素對(duì)象應(yīng)該定義id屬性，因?yàn)檫@些對(duì)象一般在頁(yè)面中都是比較唯一、固定的，不會(huì)出現(xiàn)一個(gè)結(jié)構(gòu)在同一個(gè)頁(yè)面內(nèi)重復(fù)出現(xiàn)得現(xiàn)象，如
logo、導(dǎo)航等；
4、class選擇符
語(yǔ)法：．類名{屬性：屬性值；}
應(yīng)用：<元素名稱class="類選擇符名稱"></元素名稱>
說(shuō)明：1)類選擇符的語(yǔ)法格式是：“.”加上自定義的類名稱。
2)當(dāng)我們使用類選擇符時(shí)，應(yīng)先為每個(gè)元素定義一個(gè)類屬性，如：<div class="red"></div>
注意：一個(gè)標(biāo)記上可以同時(shí)使用多個(gè)類，語(yǔ)法為<標(biāo)記class=“類名 類名”>
即：在一個(gè)標(biāo)記上同時(shí)使用多個(gè)類時(shí)，類名與類名之間用空格隔開
ID具有唯一性，CLASS具有普遍性。
5、群組選擇符
語(yǔ)法：選擇符1，選擇符2，選擇符3{屬性：屬性值；}
說(shuō)明：當(dāng)多個(gè)選擇符應(yīng)用相同的樣式，可以將選擇符用英文逗號(hào)分隔的方式，合并為一組.
使用類選擇符的一個(gè)示例如下：
.name,div,p{font-size:12px}
該樣式實(shí)現(xiàn)的效果是在類名字為name的元素、div元素、p元素中，文本的字體大小為12個(gè)像
素。
6、包含選擇符
語(yǔ)法：選擇符1 選擇符2{屬性：屬性值；}
說(shuō)明：選擇符1和選擇符2之間用空格隔開。含義就是所有選擇符1中包含的選擇符2。
使用包含選擇符的一個(gè)示例如下：
div p{font-size;12px;}
該樣式實(shí)現(xiàn)的效果是，在所有被div元素包含的p元素中，文本有字體大小為12個(gè)像素。
7、偽類選擇符
語(yǔ)法：a:link{屬性：屬性值；}
a:visited{屬性：屬性值；}
a:hover{屬性：屬性值；}
a:active{屬性：屬性值；}
說(shuō)明：1）為了簡(jiǎn)化代碼，可以把偽類選擇符中相同的聲明提出來(lái)放在a選擇符中；
2）當(dāng)這4個(gè)超鏈接偽類選擇符聯(lián)合使用時(shí)，應(yīng)注意他們的順序，正常順序?yàn)椋?/div>
a:link,a:visited,a:hover,a:active,錯(cuò)誤的順序有時(shí)會(huì)使超鏈接的樣式失效；
3)a:link可以定義未訪問(wèn)過(guò)的超鏈接樣式，有些瀏覽器會(huì)把它解析為任何超鏈接，包括
訪問(wèn)過(guò)的和未訪問(wèn)過(guò)的，因此，我們可以使用a選擇符樣式來(lái)代替a:link選擇符樣式。
4）使用與超鏈接相關(guān)的偽類選擇符時(shí)，應(yīng)為a元素定義href屬性；
CSS的基本書寫規(guī)范包括：
1. 基本書寫順序 ：建議先寫通配符、類型選擇符和重復(fù)使用的樣式，然后是偽類，后是自定義的選擇符。除了重復(fù)使用的選擇符，其他選擇符按照使用的先后書寫，這樣便于修改時(shí)尋找。
2. 書寫方式
3.注釋
注釋的語(yǔ)法如下：
/*這是一個(gè)注釋*/
優(yōu)先級(jí)
1、直接定義在標(biāo)記上的css樣式（行間樣式表）級(jí)別高。
2、內(nèi)部樣式表與外部樣式表后設(shè)的起作用。
3、當(dāng)樣式中屬性重復(fù)時(shí)，后設(shè)的屬性起作用
4、ID的定義優(yōu)先于CLASS的定義
5、類、id的優(yōu)先級(jí)別高于標(biāo)記
繼承關(guān)系：子定義會(huì)繼承父定義，但會(huì)覆蓋父定義的內(nèi)容。
文章標(biāo)題：css詳解之選擇符、優(yōu)先級(jí)及繼承關(guān)系
文章分享：http://www.rwnh.cn/news20/260270.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供移動(dòng)網(wǎng)站建設(shè)、品牌網(wǎng)站設(shè)計(jì)、面包屑導(dǎo)航、外貿(mào)網(wǎng)站建設(shè)、網(wǎng)站維護(hù)、定制網(wǎng)站
聲明：本網(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)
猜你還喜歡下面的內(nèi)容
- 中小企業(yè)網(wǎng)站欄目如何策劃 2023-05-20
- 如何防止網(wǎng)站出現(xiàn)過(guò)度優(yōu)化的情況？ 2023-05-20
- 重慶網(wǎng)站建設(shè)費(fèi)用受到影響的方面有哪些? 2023-05-20
- 重慶創(chuàng)新互聯(lián)：企業(yè)網(wǎng)站建設(shè)的7點(diǎn)建議 2023-05-20
- 在網(wǎng)站建設(shè)中如何創(chuàng)建良好的用戶體驗(yàn)度？ 2023-05-20
- 選域名不妨看一下二十條建議 2023-05-20
- 小程序的出現(xiàn)能夠取代網(wǎng)站嗎？ 2023-05-20
- 重慶域名解析常見問(wèn)題 2023-05-20
- 網(wǎng)站制作如何寫清晰代碼 2023-05-20
- 重慶從品質(zhì)出發(fā)再論重慶企業(yè)網(wǎng)站建設(shè)與優(yōu)化取勝關(guān)鍵 2023-05-20
- 重慶設(shè)置泛域名解析影響SEO優(yōu)化效果和PR值的提升 2023-05-20
- 網(wǎng)站建設(shè)中要如何提高外鏈質(zhì)量的技巧 2023-05-20
- 保證網(wǎng)站質(zhì)量必要了解的幾點(diǎn) 2023-05-20
- 網(wǎng)站建設(shè)的功能 2023-05-20
- 企業(yè)個(gè)性化定制網(wǎng)站過(guò)程中容易犯的幾個(gè)錯(cuò)誤 2023-05-20
- 成都企業(yè)網(wǎng)站策劃的終核心 2023-05-20
- 快照對(duì)網(wǎng)站有哪些影響？怎么更新？ 2023-05-20
- 重慶懶惰是重慶網(wǎng)絡(luò)公司做網(wǎng)站推廣的死亡之路 2023-05-20
- 重慶中小企業(yè)如何建設(shè)網(wǎng)站 2023-05-20