直接上案例,概念请走w3c
[https://www.w3school.com.cn/css/css_selector_child.asp]
比如说只要选择class为box的li标签而不选到最内层的li标签该如何做?
单纯用后代选择器很难做到吧!这时候子代选择器就出场了,可以这样写:
<style>
div > ul > li{
注:>是指只能一代接一代,比如:div > ul > li
}
</style>
如果想选择div中所有li该怎么做?
可以这样写:
<style>
div li{}
</style>
再比如说,同理只想选择最内层的li标签该怎么做?
可以这样写:
<style>
div > ul > li > ul > li{
}
</style>
html,body啥的就不写了,大家应该看得明白
以下是body的内容:
<div>
<ul>
<li class="box">
<ul>
<li></li>
</ul>
</li>
</ul>
</div>