日期:2014-05-17 浏览次数:20919 次
<!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=gb2312" />
<title>IE a:active bug</title>
<style>
a{font-size:12px;}
a.inline:active{
font-size:24px;
}
a.block{
display:block;
width:80px;
}
a#bgcolor:hover{
color:blue;
background:yellow;
}
a#bgcolor:active{
color:yellow;
background:blue;
}
</style>
</head>
<body>
<h1>IE a:active bug(IE6/7/8/9)</h1>
<h3>一、普通链接</h3>
<a class="inline" href="#">IE a:active bug</a>
<br/>行为:点击时字体变大,之后恢复<br/>
问题:ie6中点击完成后不能恢复;
<h3>二、块级链接</h3>
<a class="block" id="bgcolor" href="#">
<img src="ico.png"/>
<div>IE a:active bug</div>
</a>
行为:移过时背景为黄色,点击(包括图片文字及空白)时背景变蓝色,点击完成后,背景色恢复为黄色<br/>
问题:<br/>
1、ie6无法自动恢复;<br/>
2、ie7-ie9,点击a内的图片或文字时,active无效;
<h5>火狐谷歌都没有问题,唯独IE,并且6和7、8、9的bug还不一样</h5>
<h5>在保持html结构不变的前提下,如果有纯css的解决办法(js我知道怎么解决),希望能交流一下,QQ:1140215489</h5>
</body>
</html>