html - Opera 和我没有正确处理 css 伪类

问题非常非常简单:在以下浏览器中单击“red red red”时:Chrome 17、FireFox 10、IE 9、Opera 11.61 两个元素都以其适当的颜色变亮。

当点击“绿色”时，它只发生在 Chrome 和 FF 中。在 IE 和 OPERA 中没有任何反应。为什么？

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
.container:active
{
    background: red;
}
.container:active .in
{
    background: green;
}
</style>
</head>
<body>
    <div class="container">
        red<br />red<br />red<br />red<br />red<br />
        <div class="in">GREEN</div>
    </div>
</body>
</html>

有人知道解决方法吗？

最佳答案

CSS 没有定义哪些元素可以是“事件的”，以及点击元素的父元素是否也变为“事件的”。

http://www.w3.org/TR/CSS2/selector.html#dynamic-pseudo-classes

所以所有浏览器都按照规范运行。对不起!

如果您想要解决方法，请尝试使用 <a>元素而不是外部 <div> .不过需要更多的造型。和内部<div>应该是一个内联元素，以确保它仍然是有效的 HTML。
编辑:还有 <a>还必须有一个 href属性，否则它仍然无法在 IE 中工作。 (此处无法在 Opera 上进行测试。)

jsFiddle

关于html - Opera 和我没有正确处理 css 伪类，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9533692/