引导工具提示

Question

我目前有一个img标签，当人们将鼠标悬停在它上面时，我希望显示一个工具提示。据我了解，您只能在“ a”标签中放置一个工具提示，是否可以将我的img标签包围/封装以便这样做或不起作用？

例如

<li class="list-inline-item">
    <a href="whatever" data-toggle="tooltip" data-placement="auto top" title="Arduino">
        <img src="https://png.icons8.com/color/50/000000/arduino.png">
    </a>
</li>

Answer 1

这行得通。

<span class="d-inline-block" tabindex="0" data-toggle="tooltip" title="Disabled tooltip">
   <img src="https://png.icons8.com/color/50/000000/arduino.png">
</span>

工具提示不必在'a'标记中。

不要忘记添加：

<script>    
$(function () {
      $('[data-toggle="tooltip"]').tooltip()
    })
</script>

请参阅引导documentation