首页 Bootstrap5组件手册

提示框


1.需要javascript初始化
2.指向弹出提示框

HTML格式：<a>
<a href="#" data-bs-toggle="tooltip" data-bs-placement="top" title="提示内容...">链接</a>

HTML格式：<button>
<button class="btn btn-primary" data-bs-toggle="tooltip" data-bs-placement="top" title="提示内容...">按钮</button>

JavaScript代码：
<script type="text/javascript">
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
    return new bootstrap.Tooltip(tooltipTriggerEl)
})
</script>
注：固定加到<body>底部

================================================================
自定义属性：
data-bs-toggle="tooltip"       创建提示框

data-bs-placement="top"        指定提示框显示位置
参数： 
top      上边
bottom   下边
left     左边
right    右边

示例


右边显示提示框：
<button class="btn btn-primary" data-bs-toggle="tooltip" data-bs-placement="right" title="提示内容...">按钮</button>