HTML <figure> 标签

实例

用作文档中插图的图像:

<figure><p>黄浦江上的的卢浦大桥</p><p>拍摄者:W3School 项目组,拍摄时间:2010 年 10 月</p><img src="/i/shanghai_lupu_bridge.jpg" width="350" height="234" />
</figure>

<figure> 、<figcaption>标签是 HTML 5 中的新标签。

定义和用法

<figure> 标签规定独立的流内容(图像、图表、照片、代码等等)。

figure 元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响。

浏览器支持

所有主流浏览器都支持 <figure> 、<figcaption>标签。

注释:Internet Explorer 8 以及更早的版本不支持 <figure>、<figcaption> 标签。

HTML <figcaption> 标签

实例

用作文档中插图的图像,带有一个标题:

<figure><figcaption>黄浦江上的的卢浦大桥</figcaption><img src="shanghai_lupu_bridge.jpg" width="350" height="234" />
</figure>

定义和用法

<figcaption> 标签定义 figure 元素的标题(caption)。

"figcaption" 元素应该被置于 "figure" 元素的第一个或最后一个子元素的位置。

HTML figure 标签 figcaption 标签相关推荐

  1. html5中figure怎么用,HTML5中figure和figcaption标签用法

    HTML5中figure和figcaption标签一般都是配套使用的,先了解下两者的基本定义,然后结合实例来说明两者的用法. 标签规定独立的流内容(图像.图表.照片.代码等等). figure元素的内 ...

  2. figcaption标签css,[HTML]正确使用Figure和Figcaption标签(译)_html/css_WEB-ITnose

    原文: Quick Tip: The Right Way to Use Figure & Figcaption Elements figure和 figcaption元素通常作为两个语义化的标 ...

  3. html5标签详解,HTML5中figcaption标签用法详解

    HTML5中figure和figcaption标签一般都是配套使用的,先了解下两者的基本定义,然后结合实例来说明两者的用法. 标签规定独立的流内容(图像.图表.照片.代码等等). figure元素的内 ...

  4. html5 figure和figcaption

    figure标签和figcaption标签是html5新增的语义化标签. figure标签,html5语义化标签. 用于规定独立的流内容(图像.图表.照片.代码等等). figcaption标签,ht ...

  5. HTML5 之 Figure Figcaption 标签

    概述   figure 用于定义一个可附加标题的内容元素,figcaption 用于为figure元素添加标题和描述信息.   页面中的插图卡片比较常见,卡片中包含有图片的描述信息.标题或者按钮等. ...

  6. H5新标签 figcaption 定义图文并茂的html5新标签-figure、figcaption

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

  7. html5标签figure、figcaption

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

  8. html5新标签 figure 和 figcaption

    html5新标签 figure 和 figcaption <figcaption> 定义 <figure> 元素的标题. <figure> 规定自包含内容,比如图示 ...

  9. html中figure怎么调图片位置,HTMLfigure figcaption 标签定义图文并茂

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

最新文章

  1. 微调torchvision 0.3的目标检测模型
  2. 微软考虑将 Python 作为 Excel 官方脚本语言
  3. 数据库单表数据过亿_最受欢迎的三大数据库,你用过吗?
  4. 寻找MEET大会直播中奖的小伙伴,你有红包待领取~
  5. 下了Bandit,看了一个礼拜
  6. 最新 Spring 系列教程,都在这了
  7. IAR 窗口重置默认配置
  8. Rsync学习之旅上
  9. bash 函数内部变量_使用源命令将函数和变量导入Bash
  10. 基于深度学习的信道估计(DL-CE)基础知识
  11. 基于数码相机拍照图像分析的植被覆盖率(FVC)计算软件人品大家自己斟酌
  12. 我花了一夜用数据结构给女朋友写个H5走迷宫游戏
  13. diskgenius扩容c盘重启电脑卡住_DiskGenius怎么给C盘扩容?DiskGenius无损调整C盘容量方法 (全文)...
  14. 南天PR2打印机自动退纸解决办法
  15. html 选择列表框,列表框的selected属性
  16. 毕达哥拉斯定理/勾股定理
  17. 【大连理工大学】计算机专业选修:深度学习2020期末复习
  18. ID BOX 121电子护照阅读器(带RFID双天线)参数与应用说明
  19. 解决WARNING: Ignoring invalid distribution -pencv-python (c:\users\lhw\anaconda3\lib\site-packages)
  20. 微信小程序万里目_微信小程序“注册”你不知道的秘密

热门文章

  1. a-tabs defaultActiveKey默认值无效
  2. mysql怎么将成绩划分等级_MySQL按等级查询
  3. java swing表格翻页_让Swing表格支持远程后台数据翻页
  4. OpenAtom XuperChain开发者夏季论坛落幕,多位行业大咖共话开源区块链前景
  5. xdos攻击ac实验环境
  6. Python练习题答案: 杰克的家【难度:2级】--景越Python编程实例训练营,1000道上机题等你来挑战
  7. Linux与Windows的区别与比较,及Linux基本命令
  8. 酷雷曼VR丨十大“高含金量”荣誉,一起见证!
  9. BIGEMAP下载等高线(高程)使用教程
  10. 如何使用ArcGIS计算分区河流(管线)总长度