为什么 ":active" 在 Gecko 框架内不能正常工作？答案

【问题标题】：Why doesn't ":active" work properly inside a Gecko frame?为什么 ":active" 在 Gecko 框架内不能正常工作？
【发布时间】：2010-10-19 11:11:40
【问题描述】：

在我看来 Gecko 有一个涉及 ":active" 的错误。为了说明，将其放入名为 test.html 的文件中：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "hxxp://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" >

 <head>
  <style type="text/css">
   .clickable {
     border: solid black 1px;
     padding: 2px;
     cursor: pointer;
     -moz-user-select: none;
   }

   .clickable:active {
     background-color: gray;
   }
  </style>
 </head>

 <body>
   <span class="clickable">blah</span>
 </body>
</html>

现在在 FF3 中打开它。跨度应该有点像一个按钮：如果你在它上面按下鼠标，背景会改变颜色。当你 mouseup 时，它会恢复正常。

请注意，即使您在跨度内按下鼠标，将鼠标移到浏览器窗口外，然后在该处释放它，这也是有效的：在鼠标按下的部分，背景是灰色的。释放后，跨度恢复正常。

到目前为止一切顺利。但是尝试将其包装在一个框架中：

<html>
  <frameset cols="50%, 50%">
    <frame src="test.html" />
    <frame src="http://google.com" />
  </frameset>
</html>

加载那个一个。现在，当您在跨度内按下鼠标时，将鼠标移到框架外的任意位置，然后鼠标向上，跨度将永远保持灰色 - 即 CSS 认为它永远是“:active”。

这似乎只发生在一个框架中，并且问题不会出现在基于 KHTML 的浏览器中。

有人有解决方法吗？

【问题讨论】：

如果您在跨度上按住鼠标按钮，将鼠标移到窗口外，然后松开鼠标，是否也会发生这种情况（无框架）？
你不是在说我在段落中提到的以“注意这个”开头的案例吗？
是的，这似乎是一个错误......虽然老实说我更惊讶它在非框架版本中工作！
有趣的是，如果您在每一帧中放置一个 test.html 并将其中的一个置为灰色，则您可以通过在另一帧中向下移动鼠标并在原始帧中释放来解除它的灰色。奇怪！

标签： html css firefox pseudo-class firefox-3

【解决方案1】：

您没有正确的文档类型来支持框架。这可能是问题所在。

【讨论】：

架集//EN" "hxxp://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd "> (xx->tt)。但这无济于事。
我已更新帖子以包含该框架集。正如鲍勃指出的那样，它没有帮助。
投反对票有点不公平，不是吗？我的意思是，这是您实际实施的合理建议。