首頁 >web前端 >css教學 >如何選擇 CSS 中最後一個沒有特定類別的子元素?

如何選擇 CSS 中最後一個沒有特定類別的子元素?

Barbara Streisand
Barbara Streisand原創
2024-11-17 17:46:02827瀏覽

How to Select the Last Child That Doesn't Have a Specific Class in CSS?

在 CSS 中結合 :last-child 和 :not(.class) 選擇器

在 CSS 中,經常需要根據多個條件選擇特定元素。其中一個這樣的情況是選擇最後一個沒有特定班級的孩子。雖然看起來很簡單,但僅使用 :last-child 和 :not(.class) 選擇器不會產生所需的結果。

使用:last-child 和:not(.class)

:last-child 選擇器針對元素的最後一個子元素,而:not(.class) 選擇沒有指定類別的元素。但是,這些選擇器不能直接組合以達到所需的效果。

考慮以下範例:

<tr>

目標是選擇第三行,該行沒有「table_vert_controls」 「 班級。以下 CSS規則不起作用:

tr:not(.table_vert_controls):last-child

此規則將選擇最後一行,無論它是否具有“table_vert_controls”類別。選擇器無法處理這種特定組合,因此需要替代解決方案:

使用附加類

:在所需類之前向元素添加附加類,例如「最後一個孩子不上課」。然後,使用以下規則:
jQuery選擇器
.last-child-no-class:not(.table_vert_controls)
:利用 jQuery 更強大的選擇器引擎來選擇所需的元素:

以上是如何選擇 CSS 中最後一個沒有特定類別的子元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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