CSS：目标伪类和同级问题

我试图改变一个div的属性，当一个不同的div：target（ed）。一个JSFiddle在这里：http://jsfiddle.net/FC5sQ/。（我相信）问题源自的是CSS：目标伪类和同级问题

#tevents:target ~ .titlewrap {top:0;}

行在CSS中。基本上，一旦#tevents id的目标，我希望titlewrap类具有最高值为0.

'：target'是一个伪类，而不是伪元素或伪选择器。 – BoltClock

我很确定：target伪类不能像那样使用。 – j08691

@ j08691：'：target'可以与任何组合器一起使用。虽然这里的问题在于combinator而不是'：target'。 – BoltClock

一般兄弟组合器~不向后工作。所以，由于您的.titlewrap在您的HTML中出现在#tevents之前，因此您的选择器将无法工作。

不幸的是there's no previous sibling combinator，所以如果你不能改变标记和相应的改变样式，那么你不能这样做与:target和兄弟组合。

顺便说一句，你的top: 30%风格也没有任何效果，这是因为你没有为你的.titlewrap设置一个明确的height。

2012-05-17 16:50:49 BoltClock

如果是这种情况，在.titlewrap div之前定义的#tevents div会被修改过的HTML结构是否会工作？我在JSFiddle中试过，结果和以前一样。 – natosennimi

@nosenosennimi：它会工作，我在最后一段解释为什么你的结果是一样的。你需要为'.titlewrap'定义一个高度。 – BoltClock

谢谢，想通了。顺便说一句，'top：30％;'.titlewrap'在我的浏览器上正常显示。也许是一个X浏览器兼容性问题。 – natosennimi

回答