定义图文并茂的html5新标签-figure、figcaption
来源:互联网 发布:mac上photoshop 编辑:程序博客网 时间:2024/05/16 19:51
大家在写xhtml、html中常常用到一种图片列表,图片+标题或者图片+标题+简单描述。以前的常规写法:
<li>
<img src="" /><p>title</P>
</li>
而在html5中有了新标签更能语义化的定义出这中图片列表,那就是figure标签。
w3c赋予的定义:figure标签规定独立的流内容(图像、图表、照片、代码等等)。figure 元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响。
实例代码:
<figure>
<p>黄浦江上的的卢浦大桥</p>
<img src="shanghai_lupu_bridge.jpg" width="350" height="234" />
</figure>
figure用来代替原来li标签,P标签谁来取代呢?答案就是:figcaption
w3c赋予的定义:figcaption
那么上面的代码就变成了:
<figure>
<figcaption>黄浦江上的的卢浦大桥</figcaption>
<img src="shanghai_lupu_bridge.jpg" width="350" height="234" />
</figure>
0 0
- 定义图文并茂的html5新标签-figure、figcaption
- 定义图文并茂的html5新标签-figure、figcaption
- 定义图文并茂的html5新标签-figure、figcaption
- H5新标签 <figcaption> 定义图文并茂的html5新标签-figure、figcaption
- html5新标签-figure、figcaption
- html5标签figure、figcaption
- HTML5中figure和figcaption标签用法
- figure,figcaption的用法
- 从零开始前端学习[26]:html5的一些常用标签,header,footer,section,aside,figure,figcaption,nav,artical,
- DayDayUP之HTML5学习笔记 三 article、hgroup、figure、figcaption、dialog标签简单应用
- figure新标签的应用
- HTML5教程之figure标签的应用
- figure & figcaption 、details & summary 、 mark
- 27figure和figcaption元素
- HTML5的新标签
- HTML5的新标签
- HTML5中figure标签使用实例
- 利用HTML5 figure标签插入图片
- 第七题第五小题
- 四则运算
- 他真的不是我兄弟:像素跟点大不同
- oj 题目分类(转载的先存着)
- ios::sync_with_stdio(false);
- 定义图文并茂的html5新标签-figure、figcaption
- 第三章第8题
- YUY2(YUYV)转YUV420源码分析
- IOS适配前先看懂iPhone,4,5,6,6plus屏幕分辨率与像素的关系
- m_hWnd 和 this指针
- HDU 1598 find the most comfortable road
- mysql分区相关
- VS2012——WebFroms UnobstrusiveValidationMode 需要“juqry”ScriptResourceMapping.
- Structs2 HelloWorld-05 OGNL