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

  • figure标签，html5语义化标签。

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

  • figcaption标签，html5语义化标签。

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

用figure和figcaption标签的好处

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

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

html5 figure和figcaption的更多相关文章

  1. html5标签figure、figcaption

    figure.figcaption,这俩个标签都是定义图文的 常常用到一种图片列表,图片+标题或者图片+标题+简单描述.以前的常规写法: <li> <img src="te ...

  2. HTML中的figure与figcaption标签

    本来想分两篇文章来解释说明figure.figcaption的,但是这俩个标签都是定义图文的,所以我们合起来讲解,大家更能容易接受. 大家在写xhtml.html中常常用到一种图片列表,图片+标题或者 ...

  3. [翻译]小提示：使用figure和figcaption元素的正确方式

    figure和figcaption是一对经常被一起使用的语义化标签.如果你还没有看过规范中的定义,现在有机会在你的项目中使用它们了.如果你不知道怎么用,下面是关于如何正确使用它们的一些提示. figu ...

  4. HTML5<figure>元素

    HTML5<figure>元素是用来定义页面文档中独立的流内容(图像,图表,照片,代码块),figure内容与主内容有关,如果被删除,则不影响主文档流的产生. HTML5<figca ...

  5. h5中的分组元素figure、figcaption、hgroup元素介绍

    分组元素用于对页面中的内容进行分组. figure元素和figcaption元素 figure元素用于定义独立的流内容(图像.图表.照片.代码等),一般指一个独立的单元.figure元素的内容应该与主 ...

  6. HTML5 语义元素、迁移、样式指南和代码约定

    语义元素是拥有语义的元素. 什么是语义元素? 语义元素清楚地向浏览器和开发者描述其意义. 非语义元素的例子:<div> 和 <span> - 无法提供关于其内容的信息. 语义元 ...

  7. HTML5: HTML5 语义元素

    ylbtech-HTML5: HTML5 语义元素 1.返回顶部 1. HTML5 语义元素 语义= 意义 语义元素 = 有意义的元素 什么是语义元素? 一个语义元素能够清楚的描述其意义给浏览器和开发 ...

  8. Web开发——HTML基础（图像、音频和视频内容）

    参考: 参考:HTML中的图像 参考:视频和音频内容 目录: 1.HTML中的图像 1.1 我们如何在网页上放置图像? (1)替代文字(alt) (2)宽度和高度 (3)图片标题 1.2 用图形和图形 ...

  9. 2016.3.16__HTML5新特性__第八天

    HTML 5 + CSS 3 假设您认为这篇文章还不错,能够去H5专题介绍中查看很多其它相关文章. 今日代码非常冗杂,所以非常多内容直接摘自网上,假设造成您的不适.请留言告知. 非常感谢. 输入标签, ...

随机推荐

  1. WordPress致命错误 紧急处理代码

    将下面代码添加到当前主题函数模板 functions.php 中: dadd_filter( 'wp_fatal_error_handler_enabled', '__return_false' );

  2. python+selenium元素定位——8种方法

    定位元素,selenium提供了8中元素定位方法: (1)find_element_by_id() :html规定,id在html中必须是唯一的,有点类似于身份证号 (2)find_element_b ...

  3. C语言如何操作内存

    1.用变量名来访问内存(c语言对内存地址的封装.数据类型.函数名)--直接访问内存(使用地址) 如 int a; 编译器将申请32bit的内存(4个内存单元),同时将内存地址和变量名a绑定,操作a时, ...

  4. 如何让cmd启动始终以管理员身份运行（方法已失效）

    神来之图--实测以下方法已经不能使用,辗转看了好多文章,内容基本如下图,不知道谁转的谁的,总之已经是不能用的文章了.在此记录一下.至于解决办法目前没有找到,之前随笔中有提到新建一个cmd命令提示符的快 ...

  5. 2019年华南理工大学软件学院ACM集训队选拔赛 Round1

    TIps: 1.所有代码中博主使用了scanf和printf作为输入输出  2.代码中使用了define LL long long 所以在声明变量的时候 LL其实就等价于long long 希望这两点 ...

  6. nested exception is java.lang.NoClassDefFoundError: org/hibernate/validator/resourceloading/ResourceBundleLocator

    原来的hibernate-validator-5.3.0.Final.jar里没有这个接口,换成 hibernate-validator-4.1.0.Final.jar 就好了

  7. JDK11 | 第二篇 : JShell 工具

    文章首发于公众号<程序员果果> 地址 : https://mp.weixin.qq.com/s/saHBSTo4OjsIIqv_ixigjg 一.简介 Java Shell工具是JDK1. ...

  8. java NIO介绍

    前言 我们在写java程序的时候,为了进行优化,把全部的精力用在了处理效率上,但是对IO的关注却很少.这也可能是由以前java早期时JVM在解释字节码时速度慢,运行速率大大低于本地编译代码,因此以前往 ...

  9. javascript实现快速排序算法

    忘记了快速排序的思路是怎样的了,复习一下,写了两个实例,发表博文备忘. 对于快速排序的思想,可以参考白话经典算法系列之六 快速排序 快速搞定,讲得比较通俗 prototype扩展的方式 /** * 对 ...

  10. 【学习总结】java数据结构和算法-第三章-稀疏数组和队列

    相关链接 [学习总结]尚硅谷2019java数据结构和算法 github:javaDSA 目录 稀疏数组 队列 稀疏数组 稀疏数组介绍 图示 应用实例 代码实现 SparseArray.java:与二 ...