子元素選擇器

說明

後代選擇器相比,子元素選擇器(Child selectors)只能選擇作為某元素子元素的元素。

選擇子元素

如果您不希望選擇任意的後代元素,而是希望縮小範圍,只選擇某個元素的子元素,請使用子元素選擇器(Child selector)。
例如,如果您希望選擇只作為 h1 元素子元素的 strong 元素,可以這樣寫:
h1 >strong {color:red;} 這個規則會把第一個 h1 下面的 strong 元素變為紅色,但是第二個 strong 不受影響:
<h1>This is <strong>very</strong> important.</h1> <h1>This is <em>really <strong>very</strong></em> important.</h1>

語法解釋

您應該已經注意到了,子選擇器使用了大於號(子結合符)。
子結合符兩邊可以有空白符,這是可選的。因此,以下寫法都沒有問題:
h1 > strong h1> strong h1 >strong h1>strong 如果從右向左讀,選擇器 h1 > strong 可以解釋為“選擇作為 h1 元素子元素的所有 strong 元素”。

相關詞條

熱門詞條

聯絡我們