css - 如何仅设计一个特定的 angular-ui-bootstrap 工具提示以使其更宽？

Question

在我的 AngualrJS 应用程序中，我们使用 angular-ui-bootstrap 工具提示。

我有一个工具提示需要容纳长文本。SO 问题的答案 Displaying long text in Bootstrap tooltip向我展示如何使工具提示变宽...

...但是，如果我不想让所有工具提示变宽，只想一个特定的工具提示怎么办？

(注意:AngularJS 1.2.24，jQuery 可用...但我宁愿能够将样式应用于单个工具提示，也不愿变得更复杂)

Answer 1

另一方面，如果您有tooltip-append-to-body="true"，则可以使用@Daryn 代码的以下修改版本

CSS

.tooltip-400max .tooltip-inner {
  max-width: 400px;
}

HTML

<div id="element1"
  tooltip-append-to-body="true"
  tooltip-class="tooltip-400max"
  tooltip="{{ model.longTooltip }}">Text</div>
<div>More page content</div>