2

not: を使用したいので、div2 要素内のすべての p 要素を除外します。これはhtmlファイルです：

<body>
    <p> not in any div </p>
    <div id="div1">
        <p> div1 text1</p>
        <div>
            <p> div2 inner text2</p>
            <div>
                <p> div1 innermost text3</p>
                <p> div1 innermost text4</p>    
            </div>
        </div>
    </div> 

    <div id="div2">
        <p> div2 text1</p>
        <div>
            <p> div2 inner text2</p>
            <div>
                <p> div2 innermost text3</p>
                <p> div2 innermost text4</p>    
            </div>
        </div>
    </div>

    <div id="div3">
        <p> div3 text1</p>
        <div>
            <p> div3 inner text2</p>
            <div>
                <p> div3 innermost text3</p>
                <p> div3 innermost text4</p>    
            </div>
        </div>
    </div>
</body>

これは私が使用する CSSfile です (明らかに) うまく機能していません:

div:not(#div2) p{
    color:green;
}

これは、「div2 text1」を含む p 要素のみを除外しますが、div2 内の他の 3 つは除外しません:

これは、「not:」が div2 div のみを除外し、その中の 2 つの div を除外しないためだと思います。

「:not」内のコンテキストを変更して、div2 div だけでなく、div2 内のすべての div も含めるにはどうすればよいですか?

私がやろうとしていることは、jQuery を使用して簡単に実現できます。

$('div p').not('#div2 p');

要約すると、この css 行を変更するにはどうすればよいですか:

div:not(#div2) p{

それで、jQuery行と同じように（選択）しますか？または言い換えれば：

div2 でない限り、div 内にあるすべての p 要素を選択します。または言い換えれば：

単語 div1 または div3 のいずれかを含むすべての p 要素を選択するには (ただし、この情報は使用しません)

4

1 に答える 1

6

子セレクターを試しましたか?

body > div:not(#div2)
{
    color:orange
}

これは、body の直接の子孫である div のみをターゲットにします。フィドル:

http://jsfiddle.net/Xk5rb/

于 2013-07-02T22:05:01.110 に答える