我有一系列附加了类.tab-pane
的元素。他们每个人都有自己独特的身份证。我正在尝试选择没有ID .tab-pane
的每个#home
。我试过了.tab-pane:not#home{...}
但它没有用。有什么建议?
示例HTML
<div id="home" class="tab-pane">...</div>
<div id="myself" class="tab-pane">...</div>
<div id="contact" class="tab-pane">...</div>
<div id="resume" class="tab-pane">...</div>
答案 0 :(得分:3)
尝试改为:
.tab-pane:not(#home) {
color: red;
}
您未选择的内容会显示在:not()
选择器的括号内,而不是显示为“链式”伪选择器。
在这种特定情况下,由于您想要未设置样式的元素是第一个元素,您还可以使用general-sibling组合子~
来对后续兄弟节点进行不同的设置:
#home ~ .tab-pane {
color: red;
}
但是,如果不同样式(或未设置样式)的元素是第一个,那么可以只会起作用,因为CSS只能选择出现的元素稍后在DOM中,作为后续兄弟姐妹或后代的早期元素。
参考文献:
答案 1 :(得分:1)
也许你打算这样做:
.tab-pane:not(#home)
答案 2 :(得分:1)
你也可以尝试这个(这就像正则表达式)
.tab-pane:not([id^='home'])
{/*your code*/}
如果您不想包含以字母“h”开头的ID,请尝试以下内容:
.tab-pane:not([id^='h'])
{/*your code*/}
答案 3 :(得分:1)