web-dev-qa-db-ja.com

Bootstrap 3のツールチップに改行を追加します

Bootstrap 3を使用しており、divにツールチップを追加しました。 <br>\nおよび#013を使用してみました。新しい行を作成します。 Bootstrapが停止するのは問題になりますか?

<div class="content show-tooltip" data-placement="top" 
     data-original-title="1st line of text <br> 2nd line of text">
59
Pierce McGeough

マークアップにdata-html="true"を追加する必要があります。

<div class="content show-tooltip" data-html="true" data-placement="top" 
     title="1st line of text <br> 2nd line of text">

動作デモ: http://www.bootply.com/83099

189
Zim

タイトルでは、次のコードを使用して行を分割します:#013;

HTML

...title="- Item 1 &#013; - Item 2 &#013;"

CSS

.ui-tooltip {
    /* tooltip container box */
    white-space: pre-line;
}

.ui-tooltip-content {
    /* tooltip content */
    white-space: pre-line;
}
2
Thalles Noce