当我使用<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
,但它确实无法使用
答案 0 :(得分:1)
你必须尝试
img, a {border:none, outline: none;}