1

我很困惑，因为 :hover 选择器工作正常，但 :active 不工作。

设想：

第一个：sample.com/game点击不同ID的链接框游戏（例如：ID 1-101），每个盒子都使用css

#selec{background-color:white;-moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius: 10px;}

单击其中一个框 ID 时，转到 sample.com/game?id=100

我成功悬停

#selec:hover{background-color:blue;}

但我想用彩色背景激活，当框处于活动状态时（框 ID 100，红色背景和其他仍然白色，因为框 100 处于活动状态）

#selec:active{background-color:blue;}

但是没有成功，为什么？？？？？？我仍然为此感到困惑。

这个 php 文件：

<a href="?game=<?php echo $ID;?>"><div id="selec"><div class="text"><p><?php echo $text; ?></p></div></div></a>

有人帮我解决这个问题吗？感谢 *$text在框中给出名称，例如框 ID 100 是游戏 RPG

4

1 回答 1

9

:activeCSS 伪类适用于所有元素......但是<a>，如果您不在Internet Explorer 中以标准模式呈现，它仅适用于链接（例如元素） 。

<div>因此，如果您没有设置 DOCTYPE，它将不适用于您的 IE。

将此添加到 HTML 的顶部：

<!doctype html>

每个伪类的定义顺序也很重要......（以确保它们都“覆盖”前一个）......请记住：

“ Lord Vadar 的Handle Formerly Anakin”

a:link    {color:blue;}
a:visited {color:green;}
a:hover   {color:red;}
a:focus   {color:orange;}
a:active  {color:yellow;}

注意：感谢@BoltClock 在此处的 W3Schools 网站http://www.w3schools.com/cssref/sel_active.asp上指出错误，表明它仅在链接上可用。（这在现代浏览器中不再正确（以标准模式呈现））

注意 2：W3C 表示 :active 伪类已添加到 CSS 2.1 中的所有元素中，它仅在 CSS 1.0 中的链接上：“注意。还要注意，在 CSS1 中，':active' 伪类仅适用于链接。 " http://www.w3.org/TR/CSS2/selector.html#pseudo-class-selectors

于 2012-07-21T00:50:37.037 回答