我在图像上使用基于 css 悬停属性的工具提示,该页面在 IE10、IE11、Chrome 和 Firefox 上工作正常,但在 IE8 上(尚未在 IE9 上测试)工具提示不会'当我将鼠标悬停在图像上时不显示。
我正在寻找一些关于将什么添加到我的网页以完成这项工作的建议。
CAPSULAS <div id="imgel" class="imgel">
<div id="imgem" class="imgem">
<img src="/images/ER.jpg" width="16" height="16" border="0" />
<span>Valorar relación riesgo/beneficio en el embarazo.</span>
</div>
<div id="imgla" class="imgla">
<img src="/images/LC.jpg" width="16" height="16" border="0" />
<span>No usar en la lactancia.</span>
</div>
</div>
这是CSS
.imgel {
display:inline;
width:60px;
margin-left:5px;
}
.imgem {
width:19px;
display:inline;
position:relative;
margin-left:4px;
}
.imgla {
width:19px;
display:inline;
position:relative;
margin-left:4px;
}
.imgem span {
visibility:hidden;
position:absolute;
left:50px;
top:-5px;
background:#F8F8FF;
/*width:80px;*/
width:auto;
height:18px;
border:1px solid #404040;
font-size:7pt;
line-height:160%;
vertical-align:middle;
white-space:nowrap;
}
.imgla span {
visibility:hidden;
position:absolute;
left:30px;
top:-5px;
background:#F8F8FF;
/*width:80px;*/
width:auto;
height:18px;
border:1px solid #404040;
font-size:7pt;
line-height:160%;
vertical-align:middle;
white-space:nowrap;
}
.imgem:hover span {
visibility:visible;
}
.imgla:hover span {
visibility:visible;
}
问候
最佳答案
而不是使用visibility:hidden
使用
显示:无
然后使用 display:inline-block
显示它
应该可以在ei8/9及以上版本上工作
关于css - 我使用悬停的 css 工具提示在 IE8 上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22001822/