当我将鼠标悬停在div.divClass上时,应显示工具提示文本.
我怎样才能做到这一点？
@H_301_4@.divClass { width: 200px; height: 200px; border: 1px solid } @H_301_4@<div class="divClass"> <a href="#" title="Tooltip text"> test </a> </div>编辑
解决方法
无论悬停发生在何处,title属性都不能强制工具提示出现在一个固定位置.这通常不是工具提示的工作原理.但是,这是一种可能适合您的方法.
@H_301_4@.divClass {
width: 200px;
height: 200px;
border: 1px solid;
position: relative;
margin: 30px;
cursor: pointer;
}
span { display: none; }
.divClass:hover > span {
display: inline-block;
position: absolute;
top: -25px;
left: 0;
border: 2px solid red;
background-color: yellow;
}
@H_301_4@<div class="divClass">
<a href="#" title="Tooltip text"> test </a>
<span>Tooltip text</span>
</div>
参考文献：
> title attribute~MDN
> Global attributes~MDN
