CSS 后代選擇器是 CSS 中十分重要的選擇器之一，它的使用可以非常靈活地控制頁面的樣式，下面我們來詳細了解一下 CSS 后代選擇器中的孫選擇器。

div p em {
color: red;
}

上述代碼中，我們使用了三個選擇器，其中的 em 標簽就是后代選擇器中的孫選擇器。這段代碼的意思是，如果滿足以下條件，那么文本會被設置為紅色：

首先必須是一個 div 標簽，然后它的后代元素中必須包含一個 p 標簽，接著在 p 標簽的后代元素中，如果包含有 em 標簽，那么這個 em 標簽中的文本就會被設置為紅色。

需要注意的是，后代選擇器中的孫選擇器有一個前提條件，就是必須要先滿足前面的祖先選擇器和父選擇器，孫選擇器才會發揮作用。

比如在上述代碼中，如果我們把 div p 改成 p，那么孫選擇器就不會發揮作用，因為父選擇器 p 能選擇到的元素中并不包含 em 標簽。

除此之外，我們還可以使用多個孫選擇器組合起來，從而更加靈活地控制頁面樣式。

div p span em {
font-weight: bold;
}

通過上述代碼，我們就可以非常清晰地表達，頁面中 div 標簽下的 p 標簽下的 span 標簽中的 em 標簽應該被設置為加粗字體。

需要注意的是，后代選擇器的使用應該盡量減少，因為過度使用后代選擇器會降低頁面的性能，影響頁面的加載速度。