English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
The HTML <figure> element represents a block of content that is independent, often used in conjunction with a description (caption) <figcaption>, and serves as an independent citation unit. When it belongs to the main content flow, its position is independent of the main body. This tag is often used for images, illustrations, tables, code blocks, and so on in the main text. When this part is moved to an appendix or another page, it does not affect the main body.
Use the <figure> element to mark an image in a document:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Basic Tutorial Website(oldtoolbag.com)</title> </head> <body> <figure> <img src="views.png" alt="views" width="304" height="228"> </figure> </body> </html>Test and see ‹/›
IEFirefoxOperaChromeSafari
IE 9Firefox, Opera, Chrome, and Safari support the <figure> tag.
Note:IE 8 or earlier versions of IE browsers do not support the <figure> tag.
The <figure> tag specifies independent flow content (images, charts, photos, code, etc.).
The content of the <figure> element should be related to the main content, and the position of the element relative to the main content is independent. If it is deleted, it should not affect the document flow.
通常，<figure> is an image, illustration, chart, code snippet, etc., referenced in the main flow of the document, but it can be moved to another part of the document or an appendix without affecting the main flow.
You can associate the title with the <figure> element by inserting <figcaption> (as the first or last child element) within it. The first <figcaption> element found in the image is displayed as the title of the image.
<figure> tag is part of HTML 5 of the new tags.
Tip:<figcaption> The element is used to define a title for the <figure> element.
Support for <figure> tag Global attributes of HTML.
Support for <figure> tag HTML event attributes.