如何摆脱"下的蓝色图像边框

时间:2014-12-25 20:04:55

标签: html css

当我使用<a>元素时,工具提示工作正常。这是代码:

 <html>
<head>
<style>
a.tooltip {outline:none; }
a.tooltip strong {line-height:30px;}
a.tooltip:hover {text-decoration:none;} 
a.tooltip span {
    z-index:10;display:none; padding:14px 20px;
    margin-top:-30px; margin-left:28px;
    width:300px; line-height:16px;
}
a.tooltip:hover span{
    display:inline; position:absolute; color:#111;
    border:1px solid #DCA; background:#fffAF0;}
.callout {z-index:20;position:absolute;top:30px;border:0;left:-12px;}

/*CSS3 extras*/
a.tooltip span
{
    border-radius:4px;
    box-shadow: 5px 5px 8px #CCC;
}
a { 
    color: blue;
} 
</style>           
</head>

<body>  
<br><br>
<a href='#' class='tooltip'>
<img src='http://www.hasitleaked.portmerch.com/stores/hasitleaked_provider/images/search_button.gif'></img>
    <span>
      Quick description 
    </span>
</a>
</body>
</html>

问题在于<a元素,IE8显示该图像的蓝色边框。这个寄宿生不存在,我不知道为什么,但其他浏览器工作正常。我想获得图像蓝色边框的装备。我怎样才能做到这一点 ?我尽量不使用<a,但它确实无法使用

1 个答案:

答案 0 :(得分:1)

你必须尝试

img, a {border:none, outline: none;}