您好,登錄后才能下訂單哦!
這篇文章將為大家詳細(xì)講解有關(guān)css派生選擇器的使用方法,小編覺(jué)得挺實(shí)用的,因此分享給大家做個(gè)參考,希望大家閱讀完這篇文章后可以有所收獲。
css派生選擇器的使用方法:派生選擇器允許根據(jù)文檔的上下文關(guān)系來(lái)確定某個(gè)標(biāo)簽的樣式,通過(guò)合理地使用派生選擇器,可以使HTML代碼變得更加整潔。
css派生選擇器的使用方法:
通過(guò)依據(jù)元素在其位置的上下文關(guān)系來(lái)定義樣式,你可以使標(biāo)記更加簡(jiǎn)潔。
在 CSS1 中,通過(guò)這種方式來(lái)應(yīng)用規(guī)則的選擇器被稱為上下文選擇器 (contextual selectors),這是由于它們依賴于上下文關(guān)系來(lái)應(yīng)用或者避免某項(xiàng)規(guī)則。在 CSS2 中,它們稱為派生選擇器,但是無(wú)論你如何稱呼它們,它們的作用都是相同的。
派生選擇器允許你根據(jù)文檔的上下文關(guān)系來(lái)確定某個(gè)標(biāo)簽的樣式。通過(guò)合理地使用派生選擇器,我們可以使 HTML 代碼變得更加整潔。
比方說(shuō),你希望列表中的 strong 元素變?yōu)樾斌w字,而不是通常的粗體字,可以這樣定義一個(gè)派生選擇器:
li strong { font-style: italic; font-weight: normal; }
請(qǐng)注意標(biāo)記為 <strong>
的藍(lán)色代碼的上下文關(guān)系:
<p><strong>我是粗體字,不是斜體字,因?yàn)槲也辉诹斜懋?dāng)中,所以這個(gè)規(guī)則對(duì)我不起作用</strong></p> <ol> <li><strong>我是斜體字。這是因?yàn)?strong 元素位于 li 元素內(nèi)。</strong></li> <li>我是正常的字體。</li> </ol>
在上面的例子中,只有 li 元素中的 strong 元素的樣式為斜體字,無(wú)需為 strong 元素定義特別的 class 或 id,代碼更加簡(jiǎn)潔。
再看看下面的 CSS 規(guī)則:
strong { color: red; } h3 { color: red; } h3 strong { color: blue; }
下面是它施加影響的 HTML:
<p>The strongly emphasized word in this paragraph is<strong>red</strong>.</p> <h3>This subhead is also red.</h3> <h3>The strongly emphasized word in this subhead is<strong>blue</strong>.</h3>
關(guān)于css派生選擇器的使用方法就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò),可以把它分享出去讓更多的人看到。
免責(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)容。