在多个地方使用的一个地方进行目标DIV

Question

采用以下HTML：

<div id="topbar">
  <div class="sitewidth"></div>
</div>
<div class="sitewidth"></div>
<div id="content" class="sitewidth front-page">
</div>

如何定位第二个sitewidth，而不会对sitewidth中的topbar和下一个div中的{{1}}产生相同的影响？

请注意，我无法访问HTML，我只能使用CSS！

Answer 1

基于此评论

  

sitewidth用于多个地方，也就在此之后。   然而，它是第二次使用它，我认为这是它的方式   总是（换句话说：就我所知，没有任何东西介于两者之间   topbar和第二个sitewidth

和这个结构

<div id="topbar">
  <div class="sitewidth"></div>
</div>
<div class="sitewidth"></div>

然后

#topbar + .sitewidth {
your styles here
}

这只会定位sitewidth div 立即跟随您的#topbar 而没有其他。

Answer 2

如果它只是#topbar你可以试用的那个：

#topbar + .sitewidth {
    //CSS rules here
}

这是小提琴示例：http://jsfiddle.net/ho2a9wtp/

Answer 3

你可以尝试一下：

＆＃13;

＆＃13;

:not(#topbar) > .sitewidth {
  color: red;
}

＆＃13;

<div id="topbar">
  <div class="sitewidth">not this</div>
</div>
<div class="sitewidth">this</div>

＆＃13;

＆＃13;

＆＃13;