<div> <div> <div> <a href="#modal-container-732948" role="button" data-toggle="modal">Launch demo modal</a> <div role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div> <div> <div> <button type="button" data-dismiss="modal" aria-hidden="true"> × </button> <h4> Modal title </h4> </div> <div> ... </div> <div> <button type="button" data-dismiss="modal"> Close </button> <button type="button"> Save changes </button> </div> </div> </div> </div> </div> </div> </div>
（五）提示框tooltip.js
需要引入jquery.min.js、tooltip.js，也可以引入transition.js添加过渡效果。
另外，Tooltip插件不像其他插件那样，它不是纯 CSS 插件。如需使用该插件，必须使用 jquery 激活它。
$(function () { $("[data-toggle='tooltip']").tooltip(); }); <body > <a href="#" data-toggle="tooltip" title="默认的 Tooltip">默认的 Tooltip</a> <br/> <a href="#" data-toggle="tooltip" data-placement="left" title="左侧的 Tooltip">左侧的 Tooltip</a> <br/> <a href="#" data-toggle="tooltip" data-placement="top" title="顶部的 Tooltip">顶部的 Tooltip</a> <br/> <a href="#" data-toggle="tooltip" data-placement="bottom" title="底部的 Tooltip">底部的 Tooltip</a> <br/> <a href="#" data-toggle="tooltip" data-placement="right" title="右侧的 Tooltip">右侧的 Tooltip</a> <br/> <button type="button" data-toggle="tooltip" title="默认的 Tooltip">默认的 Tooltip</button> <br/> <button type="button" data-toggle="tooltip" data-placement="left" title="左侧的 Tooltip">左侧的 Tooltip</button> <br/> <button type="button" data-toggle="tooltip" data-placement="top" title="顶部的 Tooltip">顶部的 Tooltip</button> <br/> <button type="button" data-toggle="tooltip" data-placement="bottom" title="底部的 Tooltip">底部的 Tooltip</button> <br/> <button type="button" data-toggle="tooltip" data-placement="right" title="右侧的 Tooltip">右侧的 Tooltip</button> </body>
精彩专题分享：
如果大家还想深入学习，可以点击这里进行学习，再为大家附3个精彩的专题：