W3CoreUI

Figures.

Documentation and examples for displaying related images and text with the figure component in Bootstrap. Click here

Figures

Anytime you need to display a piece of content—like an image with an optional caption, consider using a <figure>.

A caption for the above image.


<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>

Align right

Aligning the figure’s caption is easy with our text utilities.

A caption for the above image.


<figure class="figure">
  <img src="..." class="figure-img img-fluid rounded" alt="...">
  <figcaption class="figure-caption text-end">A caption for the above image.</figcaption>
</figure>