| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 8.0+ | 9.2+ | 5.0+ | 4.0+ | 2.1+ | 3.0+ |
Специфікація
| HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Опис
Містить опис для тегу <figure>. Тег <figcaption> повинен бути першим або останнім елементом в групі.
Синтаксис
<figure>
<figcaption>Опис</figcaption>
</figure>
Атрибути
Немає.
Закриваючий тег
Обов'язковий.
Приклад
HTML5IE9CrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Тег FIGCAPTION</title>
<script>
document.createElement('figure');
document.createElement('figcaption');
</script>
<style>
figure {
background: #d9dabb; /* Колір фону */
display: block; /* Блочний елемент */
width: 150px; /* Ширина */
height: 190px; /* Висота */
float: left; /* Блоки вирівнюються горизонтально */
margin: 0 10px 10px 0; /* Відступи */
text-align: center; /* Вирівнювання по центру */
}
figure img {
border: 2px solid #8b8e4b; /* Параметри рамки */
}
figure p {
margin-bottom: 0; /* Відступ знизу */
}
</style>
</head>
<body>
<article>
<figure>
<p><img src="images/thumb3.jpg" alt=""></p>
<figcaption>Купецький клуб</figcaption>
</figure>
<figure>
<p><img src="images/thumb4.jpg" alt=""></p>
<figcaption>Пам'ятник Св. Володимиру</figcaption>
</figure>
</article>
</body>
</html>
Результат даного прикладу показано на рис. 1.
Браузери
Internet Explorer до версії 8.0 включно ігнорує тег <figcaption>, але відображає його вміст. Також у цьому браузері будь-які стилі не застосовуються до елементу, поки він не створений через скрипт, як показано в прикладі.
Firefox повністю підтримує цей тег починаючи з версії 4.0, але версії 3.0 і старші також правильно відображають вміст тегу.