ツールチップ・プラグインは、ユーザが要素の上にマウスポインタを移動したときに表示される、小さなポップアップボックスです：
チップ: プラグインは、（Bootstrap の個々の "tooltip.js" ファイルを使用して）個別にインクルードするか、 （"bootstrap.js" または "bootstrap.min.js" を使用して）すべてを一度にインクルードすることができます。
ツールチップを作成するには、要素に data-toggle="tooltip" 属性を追加します。
ツールチップ内に表示するテキストを指定するには、title 属性を使用します：
<a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
注: ツールチップは、jQuery で初期化しなければなりません：指定する要素を選択し、
tooltip() メソッドを呼び出します。
次のコードは、文書内のすべてのツールチップを使用できるようにします：
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
Try it Yourself »
デフォルトでは、ツールチップは、要素の最上部に表示されます。
要素の上、下、左、右側にツールチップの位置を設定するには、data-placement 属性を使用します：
<a href="#" data-toggle="tooltip" data-placement="top"
title="Hooray!">Hover</a>
<a href="#" data-toggle="tooltip"
data-placement="bottom" title="Hooray!">Hover</a>
<a href="#"
data-toggle="tooltip" data-placement="left" title="Hooray!">Hover</a>
<a
href="#" data-toggle="tooltip" data-placement="right"
title="Hooray!">Hover</a>
Try it Yourself »
チップ: ブラウザにツールチップの位置を決定させる、"auto" の値を持つ data-placement 属性 も使用することができます。例えば、値が "auto left" の場合、可能であればツールチップは左側に表示され、 それ以外の場合は右側に表示されます。
すべてのツールチップのオプション、メソッドおよびイベントの完全なリファレンスは、 Bootstrap JS ツールチップ・リファレンスをご覧ください。