新聞中心
本文向大家描述一下CSS派生選擇器的使用,CSS派生選擇器允許你根據(jù)文檔的上下文關(guān)系來確定某個(gè)標(biāo)簽的樣式。通過合理地使用派生選擇器,我們可以使HTML代碼變得更加整潔。

專注于為中小企業(yè)提供網(wǎng)站制作、做網(wǎng)站服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)咸陽免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動(dòng)了上千企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。
CSS派生選擇器
通過依據(jù)元素在其位置的上下文關(guān)系來定義樣式,你可以使標(biāo)記更加簡潔。
在CSS1中,通過這種方式來應(yīng)用規(guī)則的選擇器被稱為上下文選擇器(contextualselectors),這是由于它們依賴于上下文關(guān)系來應(yīng)用或者避免某項(xiàng)規(guī)則。在CSS2中,它們稱為CSS派生選擇器,但是無論你如何稱呼它們,它們的作用都是相同的。
CSS派生選擇器允許你根據(jù)文檔的上下文關(guān)系來確定某個(gè)標(biāo)簽的樣式。通過合理地使用派生選擇器,我們可以使HTML代碼變得更加整潔。
比方說,你希望列表中的strong元素變?yōu)樾斌w字,而不是通常的粗體字,可以這樣定義一個(gè)CSS派生選擇器:
- listrong{
- font-style:italic;
- font-weight:normal;
- }
請注意標(biāo)記為的藍(lán)色代碼的上下文關(guān)系:
我是粗體字,不是斜體字,因?yàn)槲也辉诹斜懋?dāng)中,
- 所以這個(gè)規(guī)則對(duì)我不起作用
- 我是斜體字。這是因?yàn)閟trong元素位于li元素內(nèi)。
- 我是正常的字體。
在上面的例子中,只有l(wèi)i元素中的strong元素的樣式為斜體字,無需為strong元素定義特別的class或id,代碼更加簡潔。
再看看下面的CSS派生選擇器的規(guī)則:
- strong{
- color:red;
- }
- h2{
- color:red;
- }
- h2strong{
- color:blue;
- }
下面是它施加影響的HTML:
Thestronglyemphasizedwordinthisparagraphisred.
Thissubheadisalsored.
Thestronglyemphasizedwordinthissubheadisblue.
【編輯推薦】
- 輕松實(shí)現(xiàn)CSS樣式實(shí)時(shí)切換技巧
- CSS中display:inline-block屬性妙用
- CSS2.0中最常用的十八般兵器
- CSS控制input樣式和懸停交互
- 解讀CSS中position屬性四大可選值用法
分享題目:CSS派生選擇器用法詳解
網(wǎng)址分享:http://m.fisionsoft.com.cn/article/djpgoho.html


咨詢
建站咨詢
