html5知识点—figure和figcaption的元素使用

使用figure和figcaption元素插入图片和图注

figure元素用于插入某张图片并添加描述。在HTML5以前,需要插入图片时只要额外使用div之类的元素才能将文本添加到页面中。这样做的缺点在于图片和图注并无任何关联。而现在添加figure之后,可以再利用figcaption为图片添加图注。

虽然figure通常用来插入图片,但它也可以是一段代码、图片、音乐或者视频。通常情况下,figure主要用于图片。


<figure>
    <img src="abc.jpg" alt=""/>
    <figcaption>
        Website analytics for test...
    </figcaption>
</figure>

figure元素中不仅仅只能包含一张图片,可以使用figure元素来显示多张图片。示例如下所示:


<figure>
    <img src="abc.jpg" alt=""/>
    <img src="abc1.jpg" alt=""/>
    <img src="abc2.jpg" alt=""/>
    <figcaption>
       这一组图片的描述
    </figcaption>
</figure>    

显示图片内容的时候是否总是使用figcaption元素?如果单纯是为了显示某张图片,那么使用普通的img标记足以。不过,如果它包括额外的有助于内容描述的信息,那么就应该使用figurefigcaption.最后注意,figure中只能包含一个figcaption

1.本文由杨琼博客整理发布,部分文章来自网络,如有侵犯权益,请联络博主,资源失效和内容勘误欢迎留言.

2.转载请注明本文地址:http://www.iyangqiong.com/web/301.html

3.订阅更新:您可以通过 RSS订阅本站

【推荐!必备网址导航】http://longmiao.wang/

分享到:
顶部 评论 底部