1

.tab-paneクラスが付加された一連の要素があります。また、それぞれに固有のIDがあります。.tab-paneIDを持たないものをすべて選択しようとしています#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>
4

4 に答える 4

3

代わりに試してください：

.tab-pane:not(#home) {
    color: red;
}​

JS フィドルのデモ。

:not()選択していないものは、「チェーンされた」擬似セレクターとして表示されるのではなく、セレクターの括弧内に表示されます。

この特定のケースでは、スタイルを設定したくない要素が最初の要素であるため、general-sibling コンビネータ~を使用して、後続の兄弟を異なるスタイルにすることもできます。

#home ~ .tab-pane {
    color: red;
}​

JS フィドルのデモ。

しかし、これは異なるスタイルの (またはスタイルのない) 要素が最初の要素である場合にのみ機能します。これは、CSS が DOM で後で表示される要素のみを、以前の要素の後続の兄弟または子孫として選択できるためです。

参考文献:

于 2012-10-26T17:13:52.773 に答える
1

多分あなたはこれをするつもりでした：

.tab-pane:not(#home)
于 2012-10-26T17:13:37.983 に答える
1

これを試すこともできます (これは正規表現のようなものです) 。

.tab-pane:not([id^='home'])
 {/*your code*/}

文字「h」で始まる ID を含めたくない場合は、以下を試してください。

.tab-pane:not([id^='h'])
{/*your code*/}
于 2012-10-26T17:16:34.153 に答える
1

.tab-pane:eq(noOfClass)セレクターを使用して、個々のクラスのそれぞれにアクセスできます

ここで例を確認してください

または :not セレクターを使用することもできます.tab-pane:not(#home)

于 2012-10-26T17:17:06.780 に答える