Use the <figure> element to display self-contained content, like illustrations, images, photos or code. For image-specific styles, refer to the Images page.
Usage
Use the <figcaption> element to display a caption for a given <figure>.
<figure>
<img class="img-fluid" src="..." alt="...">
<figcaption>This is a caption for the image.</figcaption>
</figure>Use text align utilities to align the caption relative to the image.
<figure>
<img class="img-fluid" src="..." alt="...">
<figcaption class="text-right">This is a caption for the image.</figcaption>
</figure>Customization
The following Sass variables are available in the theming framework:
| Variable | Description |
|---|---|
$margin-figure | The margin applied to the <figure> element. |
$color-figcaption | The color of the <figcaption> element. |