HTML5<figure>标签的定义和用法：
<figure> 标签用于对元素进行组合。
<figure> 标签规定独立的流内容（图像、图表、照片、代码 等等 ）。
<figure> 元素的内容 应该 与主内容相关，同时元素的位置相对于主内容是独立的。如果被删除，则不应对文档流产生影响。
HTML5<figure>标签的实例：
文档中的一个小节，描述 PR C：
<figure> < h1 >PRC</h1> <p>The PE ople& # 39;s Rep ub lic of China was born in 1949 .. .</p> </figure>
提示：请使用 <figcaption> 元素为元素组添加标题。
figure元素是一种元素的组合，可带有标题（可选）。figure标签用来表示 网站制作 页面上 一块 独立的内容，将其从网页上移除后不会对网页上的其他内容产生影响。figure所表示的内容可以是图片、 统计图 或代码示例。
注意：一个figure元素内最多只允许放置一个figcaption元素，其他元素可无限放置。
HTML5 figure标签的作用：
之前看到一个很有趣的轮子：Hover效果，没有使用 JavaScript 代码，全部都是 HTML + CSS便实现了，用审查者工具看了下 源 代码，发现 HTML 的基本构造如下面所示：
<figure class="effect-julia">
< img src="img/21. jpg " alt="img21"/>
<figcaption>
<h2>Passionate <span>Julia</span></h2>
<div>
<p>Julia dances in the deep dark</p>
<p>She loves the smell of the ocean</p>
<p>And dives into the morning light</p>
</div>
<a hr ef="#">View more</a>
</figcaption>
</figure>而我实现的源代码中HTML部分的代码，实例对比：
<div class="hover-area area-Julia">
<img src="imgs/21.jpg" h ei ght=" 360 " width="480">
<h3>PASSIONATE< strong >JULIA</strong></h3>
<ul>
<li>Julia dances in the deep dark.</li>
<li>She loves the smell of the ocean</li>
<li>And dives into the morning light</li>
</ul>
</div>很显然的区别是原本代码中使用了HTML5的新标签<figure>实现了页面的基础搭建，下面就 简单 聊聊这个HTML5的新标签<figure>。
值得一提的是尤其提到独立于文档主流之外，是在 官方 文档上面提到的，还提到了这个标签包含的内容应该具有独立性，可移植的， 不影响 主流内容。然后前文提到的描述这里就是作为<figure>的可选子标签<figcaption>中的内容。
现在回到之前我准备重复造的那个轮子，发现如果把对于图片的描述内容全部都包裹在<figcaption>标签中，无论是语义上还是代码结构上都更加的清晰。
HTML 4.01 与 html 5 之间的差异
<figure> 标签是 HTML 5 中的新标签。
【相关推荐】
HTML5<progress>标签是什么意思？HTML5<progress>标签的基本用法详解
HTML5中的header标签是什么意思？HTML5中header标签具体使用方法你知道吗？
以上就是HTML5 figure标签是什么意思？HTML5 figure标签的使用方法详解的详细内容，更多请关注其它相关文章！
总结
以上是 为你收集整理的 HTML5 figure标签是什么意思？HTML5 figure标签的使用方法详解 全部内容，希望文章能够帮你解决 HTML5 figure标签是什么意思？HTML5 figure标签的使用方法详解 所遇到的问题。
如果觉得 网站内容还不错， 推荐好友。
查看更多关于HTML5 figure标签是什么意思？HTML5 figure标签的使用方法详解的详细内容...