figure元素用来包含一块独立内容,该内容如果被移除掉不会对周围的内容有影响。具体来说它可以用来表示图片,统计图,图表,音频,视频,代码片段等。如果需要你也可以给该内容添加一个标题,这个标题使用figcaption来表示。figcaption只能作为figure元素的子元素,可以放在figure元素内的任何位置。形如:
<figure><img src="" alt="" /><figcaption>博客园</figcaption></figure>
不是所有图片都用figure来包裹,img 标签也有语义的。如果纯粹只是为了呈现的图,也不在文档其他地方引用,那就绝对不要用figure。如果和上下文有关,也可以把它移动到附录,那就别用figure,aside可能适合。
figure元素和aside元素看起来表达的内容差不多,但是aside所能包含的内容比figure要广。当你不知道如何选择的时候可以这样来做:这段内容对周围的内容来说是一个要点,或者很重要,不可少,那么可以使用figure,否则使用aside。
注意:
一个figure元素内最多只允许放置一个figcaption元素,也可以不放,但是其他元素可无限放置。注意不是所有图片都得用figure元素。
HTML figure 标签