选择下一个元素CSS

Question

i have 2 div elements in html : 我在html中有2个div元素：

<body>
  <div id="one"></div>
  <div></div>
</body>

I want to hide div elements after div with id="one" from CSS, I tried this : 我想在CSS之后用div id="one"隐藏div元素，我试过这个：

#one:after{display:none}

This doesn't work any other way to do? 这不能用于其他任何方式吗？

Answer 1

No, :after pseudo doesn't do that, you need to use 不， :after伪:after不这样做，你需要使用

#one + div {
   display: none;
}

Demo 演示

And if you want to hide ALL div followed by #one you will have to use 如果你想隐藏所有 div然后是#one你将不得不使用

#one ~ div {
   display: none;
}

Demo 2 演示2

Answer 2

:after applies to generated content. :after适用于生成的内容。 You want the adjacent sibling combinator : 你想要相邻的兄弟组合器：

#one + * {

}

Answer 3

If you know the exact position of the child element (like in you case its 2nd child), you can use nth-child pseudo class 如果你知道子元素的确切位置（就像你的第二个孩子一样），你可以使用nth-child伪类

div:nth-child(2)
{
    display:none;
}

Fiddle: http://jsfiddle.net/ankur1990/HDq2T/ 小提琴： http ： //jsfiddle.net/ankur1990/HDq2T/

选择下一个元素CSS

问题描述

3 个解决方案

解决方案1
2 已采纳 2014-02-17 07:53:01

解决方案2
1 2014-02-17 07:53:16

解决方案3
0 2014-02-17 07:55:07

选择下一个元素CSS

问题描述

3 个解决方案

解决方案1 2 已采纳 2014-02-17 07:53:01

解决方案2 1 2014-02-17 07:53:16

解决方案3 0 2014-02-17 07:55:07

解决方案1
2 已采纳 2014-02-17 07:53:01

解决方案2
1 2014-02-17 07:53:16

解决方案3
0 2014-02-17 07:55:07