首頁 >web前端 >css教學 >為什麼 `table > tr > td` 不選擇 HTML 表格中的 `td` 元素?

為什麼 `table > tr > td` 不選擇 HTML 表格中的 `td` 元素?

Barbara Streisand
Barbara Streisand原創
2024-12-26 22:45:111001瀏覽

Why Doesn't `table > tr > td` 在 HTML 表格中選擇 `td` 元素?
tr > td` 選擇 HTML 表格中的 `td` 元素? " />

瞭解HTML 表格子選擇器的限制

在HTML 中,表格結構由巢狀元素組成,包括table、tbody、tr 和td後代選擇器(>) 符合給定元素的後代元素,而子選擇器(>)更具體,僅匹配屬於給定元素的後代的元素。中隱式加入tbody 元素來包含tr 元素。

範例和說明

考慮以下HTML 程式碼:

在此範例中,td 元素不是直接子元素瀏覽器在table和tr 元素之間隱式添加了一個tbody元素,如圖所示:

因此,要使用子選擇器選擇td元素,需要在路徑中包含tbody元素:

結論

子選擇器(>) 僅符合元素的直接子元素。元素的後代,但不是直接子元素,因為瀏覽器隱式加入了 tbody 元素。

以上是為什麼 `table > tr > td` 不選擇 HTML 表格中的 `td` 元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn