一尘不染

:active CSS选择器不适用于IE8和IE9

css

这是我经历和解决的一系列跨浏览器差异的最后一个问题。

基本上,在Internet Explorer 8和Internet Explorer
9中,:active样式不会应用于菜单。按下时应变暗。请让我知道为什么以及如何解决。提前致谢。


阅读 326

收藏
2020-05-16

共1个答案

一尘不染

:active伪类在用户激活元素时适用。例如,在用户按下鼠标按钮并释放的时间之间。请参阅W3

但是,您正在将:active选择器应用于<li>元素, :active``<a>元素 不能处于活动状态,因为它从未真正激活过-
只是悬停了。
您应将 状态 应用于IE 6的<-True。

更新:
这是jsFiddle上的一个测试示例,您可以看到它在<a>元素上可以正常运行,但在元素上不能正常运行<li>

:active伪类在用户选择链接时适用。

CSS1在这种行为上有点模棱两可:“一个“活动”链接是阅读器当前正在选择的链接(例如,通过按下鼠标按钮)。另外,在CSS1中,:active与:link和:visited是互斥的。(并且没有:hover伪类。)

CSS2进行了更改,以便:active的规则可以与:visited或:link同时应用。行为得到了更好的解释:“:active伪类在用户激活元素时适用。例如,在用户按下鼠标按钮并释放它的时间之间。”

IMO,FF等人比CSS更符合CSS2。但是由于链接应该加载新页面,因此IE可以合理地说链接在新页面加载时仍处于“活动”状态,这就是发生的情况。

您可以通过单击链接在FF中看到类似的违反直觉的行为,但是在按住鼠标按钮的同时将鼠标移出链接。该链接未激活(未加载新页面),但该链接仍处于:active状态。另一方面,Chrome和Opera会停用链接,但时间不同。鼠标离开链接区域后立即进行Chrome浏览,Opera直到释放鼠标按钮。在此示例中,IE的行为与FF相同。(将鼠标从链接上拖出后,点击“
Enter”,您将看到更多行为上的差异。)

由于规范中的歧义,我不会将这些差异称为“错误”。

我可以提供的唯一解决方法是接受您无法控制浏览器行为的每个方面的信息。不同浏览器的用户对行为的期望不同,如果您开始迷惑用户的期望,那么您将走在错误的道路上。

2020-05-16