HTML тег <figure>

❮ Назад Вперед ❯

Тег <figure> используется для группирования контента, который дополняет или иллюстрирует содержание документа. В теге могут содержаться изображения, диаграммы, иллюстрации, примеры кодов и т.д.

Содержимое тега <figure> относится к основному потоку веб-контента, однако воспринимается как автономная единица.

Для добавления подписи или пояснений к содержимому тега <figure> используется тег <figcaption>. Тег <figcaption> включается в тег <figure> и размещается в качестве первого или последнего дочернего элемента. Если <figcaption> является первым вложенным элементом, то содержимое будет отображаться вверху изображения.

Синтаксис

Содержимое тега пишется между открывающим (<figure>) и закрывающим (</figure>) тегами.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
  </head>
  <body>
    <p>Симпатичный ребенок</p>
    <figure>
      <img src="/uploads/media/default/0001/01/25acddb3da54207bc6beb5838f65f022feaa81d7.jpeg" alt="A Cute Baby" width="250" height="200">
    </figure>
  </body>
</html>