<body>
<div class="container">
<h1 class="page-header">对话框</h1>
<p><a title="这是一个提示信息" rel="tooltip" href="#">Tooltip</a></p>
<p><a title="提示信息标题" data-content="提示信息详细内容" rel="popover" href="#">Popover</a></p>
</div>
<script type="text/javascript" src="bootstrap-3.3.7-dist/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<script>
$("a(rel=tooltip)").tooltip()
$("a(rel=popover)").popover()
</script>
</body>
a标签
-title属性：提示信息的内容
-rel属性：值为tooltip
script标签：包含语句$("a(rel=tooltip)").tooltip()，意为，当a标签的rel属性值为tooltip时，使用tooltip插件显示提示信息。
a标签
-title属性：提示信息的标题
-data-content属性:提示信息的内容
-rel属性：值为popover
script标签：包含语句$("a(rel=popover)").popover()，意为，当a标签的rel属性值为popover时，使用popover插件显示提示信息。
tooltip工具提示信息
鼠标悬停在文字上方时，显示工具提示信息（title的值）。
popover工具提示信息
鼠标悬停在文字上方时，显示工具提示信息的标题（title的值）和内容（data-content的值）。此处只显示了提示信息的标题。
网友评论