Bootstrap figures are commonly used elements for displaying images with the caption. A caption can be left-aligned or right-align.

Detailed documentation and more examples you can find in our Bootstrap Figures Docs


Basic example

Use the included .figure , .figure-img and .figure-caption classes to provide some baseline styles for the HTML5 <figure> and <figcaption> elements. Images in figures have no explicit size, so be sure to add the .img-fluid class to your <img> to make it responsive

...
A caption for the above image.

...
A caption for the above image.

Mask and overlay

Image of ballons flying over canyons with mask pattern one.

.pattern-8


smaple image

strong overlay