不太明白这节所说的用于选择指定标签元素的第一代子元素,能举例说明一下吗?
还有一个比较有用的选择器子选择器,即大于符号(>),用于选择指定标签元素的第一代子元素。如右侧代码编辑器中的代码:
.food>li{border:1px solid red;}
这行代码会使class名为food下的子元素li(水果、蔬菜)加入红色实线边框。
<ul class="food">
<li>水果
<ul>
<li>香蕉</li>
<li>苹果</li>
<li>梨</li>
</ul>
</li>
<li>蔬菜
<ul>
<li>白菜</li>
<li>油菜</li>
<li>卷心菜</li>
</ul>
</li>
</ul>
.food下面的第一代子元素为<ul>,<li>第二代子元素
比如说:<p>我是<scan id:"first">我是<scan id:"second">我是孙元素</scan>子元素</scan>父元素</p>
则p #first{
}是子元素;
则p #first #second{
}是子元素;