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
元素。