<a class="tooltips" href="#tooltips">这就是Tooltips<span>这些附加的说明文字在鼠标经过的时候显示。
</span></a>
<style type="text/css">
/*Tooltips*/
.tooltips{
position:relative/*这个是关键*/
z-index:2
}
.tooltips:hover{
z-index:3
background:none/*没有这个在IE中不可用*/
}
.tooltips span{
display: none
}
.tooltips:hover span{ /*span 标签仅在 :hover 状态时显示*/
display:block
position:absolute
top:21px
left:9px
width:15em
border:1px solid black
background-color:#ccFFFF
padding: 3px
color:black
}
</style>
在tooltip样式中加入 display;block属性!显示正常!.tooltip{display:blockposition:relative/*这个是关键*/ z-index:2}css代码如下
<style type="text/css">
/*Tooltips*/
.tooltips{ display:blockposition:relative/*这个是关键*/ z-index:2}
.tooltips:hover{ z-index:3background:none/*没有这个在IE中不可用*/ }
.tooltips span{ display: none}
.tooltips:hover span{
/*span 标签仅在 :hover 状态时显示*/
display:block
position:absolute
top:2px
left:1px
width:220px
border:1px solid black
background-color:#FFFFFF
padding: 3px
color:black
}
</style>
希望能帮到您,谢谢!