Тег <figure>

Синтаксис

<figure>...</figure>

Описание

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

Обычно применяется для иллюстраций, фрагментов кода, схем, графиков, диаграмм и др.

Примечание!

Чтобы добавить заголовок или пояснение к содержимому тега <figure>, используйте тег <figcaption>. Для добавления изображения используйте тег <img>.

Тег поддерживает глобальные атрибуты и атрибуты события.

Пример

HTML-код:

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Тег figure</title>
</head>
<body>
    <figure>
        <img src="programmer.jpg" width="300" height="175">
        <figcaption>Программист за работой</figcaption>
    </figure>
</body>
</html>

Отображение в браузере:

Программист за работой

Параметры CSS по умолчанию

figure {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 40px;
    margin-right: 40px;
}

Поддержка браузера

Элемент

Chrome

Chrome

Opera

Opera

Firefox

Firefox

Safari

Safari

Microsoft Edge

Microsoft Edge
<figure> Да Да Да Да Да