0

在 IE 上正确呈现这个的一些想法？？？？:active 只有当我点击跨区域时才会出现。我想在不使用 javascript 的情况下做到这一点。在 chrome 和 firefox 上运行完美。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sem título</title>
<style type="text/css">
a
{
    padding:20px;
    border:1px;
    display:block;
}

a span
{
    width:96px;
    height:96px;
    display:block;
    border:1px solid;
}

a:hover
{
    background-color:#ccc;
}

a:active
{
    background-color:#666;
}

</style>
</head>

<body>
<a href="#">    
    <span>casa</span>
</a>
</body>
</html>
4

2 回答 2

1

您可以使用位于其正上方的 a 元素的伪元素来解决此问题：

a {
  position: relative;
}
a:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

缺点是您无法选择 a 元素内的任何文本。

IE8+ 支持伪元素。IE7 的解决方法需要 CSS 表达式，但因为您不想使用 Javascript……</p>

于 2013-01-14T11:52:37.787 回答
0

在你的 CSS 上试试这个代码

    ul.active_a li a:link    { color: red;}

这段代码可以帮助你.. http://jsfiddle.net/easwee/WVrzu/16/

我用IE测试过。它工作得很好。

祝你好运 ！

于 2013-01-14T11:58:20.703 回答