44

Bootstrap ツールチップは、デフォルトでテキストを中央に揃えます。左揃えでお願いします。CSSファイルを変更する代わりに、HTML内でこれを行う良い方法はありますか?

ここに私のサンプルコードがあります:

<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>
4

6 に答える 6

95

これは、Bootstrap バージョン 2.2.2、3.3.6、および 4 でうまく機能します。

.tooltip-inner {
    text-align: left;
}
于 2013-10-14T13:38:08.897 に答える
9

ブートストラップツールチップを使用して（data-htmlを使用して）ツールチップにhtmlを含めたい場合

ここにコード：

<span data-toggle="tooltip" data-html="true" title="<p style='text-align:left'>Hello again<br/> this is tooltop</p>">

追加の注意として、タグ align='left' の代わりに style='text-align:left' を使用する必要があります。

于 2018-01-24T08:30:13.093 に答える
1

あなたのbootstrap.css（またはbootstrap.min.css）で以下を変更してください。v3でも機能します

.tooltip-inner{
...
text-align:center; //change to left
...
}
于 2015-10-26T16:17:56.730 に答える