与子孙后代挑选器相比,子元素挑选器(Child selectors)只能挑选做为某元素子元素的元素。
挑选子元素
假如您不期待挑选随意的子孙后代元素,而是期待变小范畴,只挑选某个元素的子元素,请应用子元素挑选器(Child selector)。
比如,假如您期待挑选只做为 h1 元素子元素的 strong 元素,能够这样写:
h1 > strong {color:red;}
这个标准会把第1个 h1 下面的两个 strong 元素变成鲜红色,可是第2个 h1 中的 strong 不会受到危害:
<h1>This is <strong>very</strong> <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 元素”。
融合子孙后代挑选器和子挑选器
请看下面这个挑选器:
table.company td > p
上面的挑选器会挑选做为 td 元素子元素的全部 p 元素,这个 td 元素自身从 table 元素承继,该 table 元素有1个包括 company 的 class 特性。