对齐引导程序工具提示中的文本

Question

Bootstrap 工具提示默认将文本居中对齐。我想向左对齐。有没有什么好的方法可以在 HTML 中执行此操作，而不是修改 CSS 文件？

这是我的示例代码：

 <p rel="tooltip" title="Text in tooltip I want to align">Hover over here</p>

<script type="text/javascript">
   $(document).ready(function () {
      $("p").tooltip();
   });
</script>

我已经尝试过但没有用：

 <p rel="tooltip" data-html="true" title="<p align='left'>Text in tooltip</p>">Hover over here</p>

原文由 agerrr 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

你试过这个吗？

 <style>
 .tooltip.show p {
   text-align:left;
 }
</style>

注意：一旦工具提示可见，bootstrap 会自动添加 .show。

尽管有官方文档（ 来源），但我认为您不应该在工具提示标题属性中包含 HTML 代码。这个我推荐：

 $("p").tooltip({
  html: true,
  title: '<p>Text in tooltip</p>'
});

另外，通过 p 引用段落也是一个坏主意，因为您的文档中可能会有很多这样的段落。改为通过 id 引用：

  <p id="myparagraph"> Hover over here </p>
 $("#myparagraph")

原文由 siemanko 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

以下内容在 Bootstrap 版本 2.2.2、3.3.6 和 4 中运行良好：

 .tooltip-inner {
    text-align: left;
}

原文由 Tobias 发布，翻译遵循 CC BY-SA 3.0 许可协议