我如何用CSS选择它？

Question

可以说我有以下......

<div>
    <div>
        <div>
            <div></div>  <<<Select this one..
            <div></div>  <<<Not this one..
            <div></div>  <<<Select this one..
            <div></div>  <<<Select this one..
        </div>
    </div>
</div>

我怎么会选择那些3 divs不添加任何类或ID？这甚至可能吗？

Answer 1

您可以使用:not()和:nth-​​child()伪类.

div > div > div > div:not(:nth-child(2)){
  color: red;
}

<div>
  <div>
    <div>
      <div>Test</div> 
      <div>Test</div>
      <div>Test</div>
      <div>Test</div>
    </div>
  </div>
</div>

在jsFiddle演示

注意:对于ie8支持,您可以在jQuery中使用相同的选择器并以这种方式设置元素的样式.

$("div > div > div > div:not(:nth-child(2))")
	.css("background-color", "yellow")

<div>
  <div>
    <div>
      <div>Test</div> 
      <div>Test</div>
      <div>Test</div>
      <div>Test</div>
    </div>
  </div>
</div>

<!-- External Resources -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 2

如果您需要支持IE7,您可以使用:

div > div > div > div + div + div, 
div > div > div > div:first-child {
    color: orange;
}

http://jsfiddle.net/4TYcb/1/