在CSS3中，子代選擇器是指通過元素層次結構中的父元素和子元素之間的關系進行選擇的選擇器。子元素是父元素的直接后代，即它們直接出現在父元素內部的元素。
.parent{
background-color: #eee;
}
.parent >.child{
font-size: 18px;
color: blue;
}代碼中的".parent >.child"表示選擇父元素class名為parent的元素的直接子元素class名為child的元素。比如：
<body> <div class="parent"> <ul> <li class="child">子元素1</li> <li class="child">子元素2</li> </ul> <p class="child">子元素3</p> </div> </body>
在該示例中，CSS樣式只會應用于<p class="child">子元素3</p>，而不會應用于<ul>和其中的子元素。
子代選擇器可以避免不必要的樣式應用到其他元素上，提高頁面性能。同時被選中的元素也具有更加明確的層次結構，使得樣式更加清晰明了。