Skip to main content

Tooltip in Bootstrap 5

Bootstrap Tooltip

Bootstrap provides a simple way to add tooltips to any HTML element using the data-bs-toggle="tooltip" attribute.

To create a tooltip in Bootstrap 5, you first need to include the Bootstrap CSS and JavaScript files in your HTML file.

As an example:

Editor

Loading...

In this example:

  • We have four buttons that have tooltips on top, bottom, left, and right.
  • The data-bs-placement attribute is used to specify the position of the tooltip.
  • The title attribute is used to specify the text that appears in the tooltip.
tip

We also include the bootstrap.bundle.min.js JavaScript file at the end of the body tag. This is necessary to initialize the tooltip functionality.