子選擇器只選擇元素的直接後代  不隔代遺傳哦

看一段程式碼

<ul id="nav" >
    <li><a href="#">Home</a></li>
    <li><a href="#">Services</a>
    <ul>
        <li><a href="#">Design</a></li>
        <li><a href="#">Development</a></li>
        <li><a href="#">Consultancy</a></li>
    </ul>
    </li>
    <li><a href="#">Contact Us</a></li>
</ul>
 

加入css後，子選擇器指定列表的子元素樣式，不影響它的孫元素

<style>
   #nav>li {
  background: url(images/folder.png) no-repeat left top;
  padding-left: 20px;
}
</style>

轉載自：《精通Css 第二版》