首页前端开发其他前端知识html5里面figcaption与figure的使用方法是什么

html5里面figcaption与figure的使用方法是什么

时间2024-03-27 08:10:03发布访客分类其他前端知识浏览1294
导读:今天就跟大家聊聊有关“html5里面figcaption与figure的使用方法是什么”的内容,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。 这篇文章主要介绍了ht...
今天就跟大家聊聊有关“html5里面figcaption与figure的使用方法是什么”的内容,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。

这篇文章主要介绍了html5 figure和figcaption的使用方法的相关资料,有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。

figure标签和figcaption标签是html5新增的语义化标签。

figure标签,html5语义化标签。

用于规定独立的流内容(图像、图表、照片、代码等等)。

figcaption标签,html5语义化标签。

与figure配套使用,用于标签定义figure元素的标题。

用figure和figcaption标签的好处

搜索引擎搜索到figure的时候会知道,这里存放的是图片、图表、照片、代码等媒体,不不会认为这里存放的是文章等其他东西。搜索引擎搜索的时候更快捷更便利。
另一方面程序员在看的时候,看到这个标签的时候,就会知道,这里存在的就是图片等媒体,便于阅读。

下面用图简单描述下这两个标签的使用方法

案例1:

不带有标题的figure元素:

figure>
    
    img alt="脚本之家" src="logo.png"/>
    
/figure>
    

案例2:

带有标题的figure元素:

figure>
    
    img alt="脚本之家" src="logo.png"/>
    
    figcaption>
    脚本之家,脚本之家是国内专业的网站建设资源、脚本编程学习类网站,提供asp、php、asp.net、javascript、jquery、vbscript、dos批处理、网页制作、网络编程、网站建设等编程资料/figcaption>
    
/figure>
    

案例3:

多个图片,同一个标题的figure元素:

figure>
    
    img alt="脚本之家1" src="logo1.png"/>
    
    img alt="脚本之家2" src="logo2.png"/>
    
    img alt="脚本之家3" src="logo3.png"/>
    
    figcaption>
    脚本之家,脚本之家是国内专业的网站建设资源、脚本编程学习类网站,提供asp、php、asp.net、javascript、jquery、vbscript、dos批处理、网页制作、网络编程、网站建设等编程资料/figcaption>
    
/figure>
    



以上就是关于html5里面figcaption与figure的使用方法是什么的介绍啦,需要的朋友可以参考上述内容,希望对大家有帮助,欢迎关注网络,小编将为大家输出更多高质量的实用文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

html5figure

若转载请注明出处: html5里面figcaption与figure的使用方法是什么
本文地址: https://pptw.com/jishu/654090.html
HTML5中如何使用json对象,代码是什么? 引用传递在go语言里有用到吗,为什么

游客 回复需填写必要信息