首頁 > web前端 > css教學 > 如何在 CSS 中選擇沒有特定類別或屬性的元素?

如何在 CSS 中選擇沒有特定類別或屬性的元素?

Patricia Arquette
發布: 2024-12-17 21:55:16
原創
332 人瀏覽過

How Can I Select Elements Without Specific Classes or Attributes in CSS?

CSS 中的否定類別和屬性選擇器

需要選擇缺少特定類別或屬性的元素? CSS 透過 :not() 偽類提供了解決方案。

:not() 偽類

:not() 偽類可讓您否定選擇器,選擇不符合指定條件的元素。通常,類別選擇器的使用方式如下:

:not(.printable) {
    /* Styles for non-printable elements */
}
登入後複製

同樣,屬性選擇器也可以被否定:

:not([attribute]) {
    /* Styles for elements without the attribute */
}
登入後複製

範例

考慮以下HTML:

<html>
登入後複製

選擇所有符合的元素沒有「printable」類,請使用以下 CSS 規則:

:not(.printable) {
    background-color: lightgray;
}
登入後複製

這將以淺灰色突出顯示導航和 a 元素。

瀏覽器支援與替代方案

IE8 及更早版本不支援 :not()。作為替代方案,您可以為具有「可列印」類別的元素建立樣式規則。如果這不可行,請考慮重組標記以適應限制。

注意事項

:not(.printable) 上的諸如 display: none 之類的屬性將完全刪除佈局中的元素及其後代。為了避免這種情況,請使用visibility:hidden代替,它允許可見的後代顯示,而隱藏的元素繼續影響佈局。

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

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板