修改 Bootstrap 工具提示的布局答案

【问题标题】：Modify the layout for the Bootstrap tooltip修改 Bootstrap 工具提示的布局
【发布时间】：2020-05-19 14:58:58
【问题描述】：

我的 asp.net mvc 核心中有以下代码：-

<input asp-for="b5" type="text" class="form-control" data-toggle="tooltip" data-placement="top" title="Update the number to match your case.">

现在我定义为在顶部显示工具提示。但在 Firefox 和 Chrome 上，工具提示将显示在字段的随机位置。

第二个问题，在所有浏览器上，工具提示都将显示没有任何布局，所以我如何添加类似于此链接中提到的布局https://getbootstrap.com/docs/4.0/components/tooltips/:-

【问题讨论】：

【解决方案1】：

您是否遵循了您提供的文档链接中的建议？

工具提示依赖于第 3 方库 Popper.js 进行定位。您必须在 bootstrap.js 之前包含 popper.min.js 或使用包含 Popper.js 的 bootstrap.bundle.min.js / bootstrap.bundle.js 以使工具提示起作用！

您还需要在 JavaScript 中启用工具提示：

$(function () {
  $('[data-toggle="tooltip"]').tooltip()
})

【讨论】：