Каждый раз, когда вам нужно отобразить часть содержимого, например изображение с необязательной подписью, рассмотрите возможность использования файла <figure>
.
Используйте входящие в комплект .figure
, .figure-img
и .figure-caption
классы , чтобы обеспечить некоторые базовые стили для HTML5 <figure>
и <figcaption>
элементов. Изображения на рисунках не имеют явного размера, поэтому обязательно добавьте .img-fluid
класс в свой, <img>
чтобы сделать его адаптивным.
<figure class="figure">
<img src="..." class="figure-img img-fluid rounded" alt="...">
<figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>
Выровнять заголовок рисунка легко с помощью наших текстовых утилит .
<figure class="figure">
<img src="..." class="figure-img img-fluid rounded" alt="...">
<figcaption class="figure-caption text-right">A caption for the above image.</figcaption>
</figure>