Проблемой в HTML всегда были подписи к изображениям. Как сделать так, чтобы подпись и изображение составляли единый элемент? В стандарте HTML5 появился новый тег figure, позволяющий это сделать.
Тег
<figure>
используется в HTML5 для группирования контента, который дополняет или иллюстрирует основное содержание документа. Он может содержать изображения, видео, диаграммы, примеры кода и другие элементы (не только изображения), которые можно рассматривать как автономные единицы.
Пример
<figure align="center">
<img src="image.jpg" alt="Описание изображения">
<figcaption>Подпись к изображению</figcaption>
</figure>
Тег <figcaption>
Для добавления подписи к содержимому тега
<figure>
используется тег
<figcaption>
. Этот тег должен быть первым или последним дочерним элементом внутри
<figure>
.
- Размещение
<figcaption>
:
- Если
<figcaption>
находится в начале <figure>
, подпись будет отображаться над изображением.
- Если
<figcaption>
находится в конце <figure>
, подпись будет отображаться под изображением.
Тег
<figure>
поддерживается большинством современных браузеров, начиная с Internet Explorer 9, Chrome 8, Firefox 4 и других.