在stackoverflow中，当我们将鼠标悬停在用户的声誉上时，我们会看到一个文本。我在很多地方看到过这种情况，源代码告诉我，它可以在没有js的情况下完成。我试过了，却只得到了这个
<div="text">hover me</div>
title属性也适用于其他html元素，例如链接…
<a title="hover text" ng-href="{{getUrl()}}"> download link
</a>
您正在寻找工具提示
对于基本的工具提示，您需要:
<div title="This is my tooltip">
对于一个更花哨的javascript版本，你可以查看:
http://www.designer-daily.com/jquery-prototype-mootool-tooltips-12632
上面的链接提供了12个工具提示选项。
在这种情况下，我经常使用缩写html标签。
<缩写标题=“悬停”>文本</abbr>
https://www.w3schools.com/tags/tag_abbr.asp
这也可以在CSS中完成，以获得更多的可定制性:
.hoverable { 位置:相对; ｝ .hoverable >。hoverable__tooltip { 显示:没有; ｝ .hoverable:悬浮>。hoverable__tooltip { 显示:内联; 位置:绝对的; 上图:1 em; 左:1 em; 背景:# 888; 边框:1px纯黑色; ｝ < div class = " hoverable”> <span class="hoverable__main">正文</span> <span class="hoverable__tooltip">悬停文本</span> . < / div >
(显然，样式可以改进)
