CSS中經常用到的選擇器之一就是嵌套選擇器,它使用 a b 的形式表示一個元素是另一個元素的后代元素。
a b { property: value; }
其中,a 和 b 都可以是標簽名、類名、ID名等選擇器。
例如,ul li a
表示選擇所有在 ul 元素中的 li 元素中的 a 元素,.nav a
表示選擇具有 nav 類名的元素中的所有 a 元素。
需要注意的是,嵌套選擇器不僅可以表示直接嵌套的元素,也可以表示間接嵌套的元素。
.item .info p { property: value; }
如上面的示例代碼,它表示選擇具有 item 類名的元素中,嵌套了一個類名為 info 的元素,該元素中又嵌套了一個 p 元素。它可以匹配以下 HTML 結構:
<div class="item"> <div class="info"> <p>這是一個段落</p> </div> </div>
嵌套選擇器在 CSS 中非常靈活,能夠幫助開發者快速定位需要修改的樣式,從而提高開發效率。