选择元素后面没有其他元素

Question

我需要能够选择HTML p 标记，只有在没有其他 div 元素后才能使用特定类。例如，我需要选择 P

<div id="myContainer">
    <p>...</p>
    <div>...</div>
</div>

但不是这个，因为它后跟一个div，其中class =＆＃34; red＆＃34;。

<div id="myContainer">
    <p>...</p>
    <div class="red">...</div>
</div>

以下是我的尝试：

#myContainer > p ~ div:not(.step) 

Answer 1

您不能使用CSS来定位以前的元素，但根据您的HTML结构，您可以使用直接的兄弟选择器。

CSS：

.myContainer p + div:not(.red)   {
   border: 1px solid #000;
}

HTML：

<div class="myContainer">
    <p>...</p>
    <div>...</div>
</div>
<div class="myContainer">
    <p>...</p>
    <div class="red">...</div>
</div>

DEMO http://jsfiddle.net/92VVZ/

Answer 2

这是什么意思？然后，你几乎就在那里。

DEMO

/* will select p not directly followed by div.red */
#myContainer > p + div:not(.red)