html5--2.9新的布局元素(6)-figure/figcaption
html5--2.9新的布局元素(6)-figure/figcaption
学习要点
- 了解figure/figcaption元素的语义和用法
- 通过实例理解figure/figcaption元素的用法
- figure元素
- figure/figcaption都是HTML5中新增的元素
- figure元素是一个媒体组合元素，也就是对其他的媒体元素进行组合，比如：图像、图表等等
- figcaption元素
- 用来给figure元素定义标题。
实例
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<h2>我是一个厨艺爱好者</h2>
<p>我是一个厨艺爱好者............</p>
<figure>
<img src="p1.jpg" alt="" width="100">
<img src="p2.jpg" alt="" width="100">
</figure>
<figcaption>我的厨艺作品1</figcaption>
<figure>
<img src="p3.jpg" alt="" width="100">
<img src="p4.jpg" alt="" width="100">
</figure>
<figcaption>我的厨艺作品2</figcaption>
<body>
</body>
</html>
html5--2.9新的布局元素(6)-figure/figcaption的更多相关文章
- html5--2.9新的布局元素(5)-hgroup/address
html5--2.9新的布局元素(5)-hgroup/address 学习要点 了解hgroup/address元素的语义和用法 通过实例理解hgroup/address元素的用法 对照新元素布局与d ...
- html5--2.7新的布局元素(4)-time
html5--2.7新的布局元素(4)-time 学习要点 了解微格式的概念 掌握time元素的用法 微格式的概念 HTML5中的微格式,是一种利用HTML5中的新标签对网页添加附加信息的方法,附加信 ...
- html5--2.1新的布局元素概述
html5--2.1新的布局元素概述 学习要点 了解HTML5新标签(元素)的优点 了解本章要学习的新的布局元素 了解本章课程的安排 HTML5新标签的优点: 更注重于内容而不是形式 对人的友好:更加 ...
- html5--2.6新的布局元素(5)-nav
html5--2.6新的布局元素(4)-aside/nav 学习要点 了解aside/nav元素的语义和用法 通过实例理解aside/nav元素的用法 aside元素 aside元素通常用来设置侧边栏 ...
- html5--2.5新的布局元素(4)-aside/nav
html5--2.5新的布局元素(4)-aside/nav 学习要点 了解aside/nav元素的语义和用法 通过实例理解aside/nav元素的用法 aside元素(附属信息) aside元素通常用 ...
- html5--2.4新的布局元素(3)-section
html5--2.4新的布局元素(3)-section 学习要点 了解section元素的语义和用法 通过实例理解section元素的用法 article元素和section元素的区别和共同点 art ...
- html5--2.3新的布局元素(2)-article
html5--2.3新的布局元素(2)-article 学习要点 了解article元素的语义和用法 完成一个简单的实例 article元素(标签) 用于定义一个独立的内容区块,比如一篇文章,一篇博客 ...
- html5--2.1新的布局元素(1)-header/footer
html5--2.1新的布局元素(1)-header/footer 学习要点 了解header/footer的语义和用法 使用header/footer进行一个简单的布局 header元素(标签) 用 ...
- HTML5中支持新的媒体元素有这些
HTML5对媒体的支持性很强,支持以下媒体元素: · audio 定义音频 · video 定义视频 · embed 作为外部应用的容器 · source 多种媒体源的支持 · track ...
随机推荐
- MongoDB基本文件操作
MongoDB中主要的文件操作有put.get.list.search几种.能够非常方便地进行文件存储于查找,下面是一个简单的演示样例. 1.利用dd命令生成要求大小随机文件 2.使用put命令将生 ...
- linux虚拟机上挂载U盘
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMTQwMjU5Ng==/font/5a6L5L2T/fontsize/400/fill/I0JBQk ...
- css：选择器
http://blog.csdn.net/xyz121323693/article/details/8516297 交集选择器 并集选择器 后代选择器 子代选择器 http://www.cnblogs ...
- 自己定义字体之BMFont的使用
***************************************转载请注明出处:http://blog.csdn.net/lttree************************** ...
- 应用程序之UITableView的Plain用法和cell缓存池优化
效果展示 过程分析 代码实现 cell缓存池优化 一.效果展示 二.过程分析 首先通过三步创建数据,展示数据 监听选中某一个cell时调用的方法 在cell中创建一个对话框 修改对话框中的值,并且重新 ...
- 用命令行执行ROBOT FRAMEWORK
除了在ride中执行用例,我们也可以通过命令行的形式执行用例. 1.执行一整个项目 pybot+项目路径 2.执行某个测试集 pybot+测试集的路径 3.执行某个测试集里面的某个用例 pybot - ...
- webapi设置一个Action同时支持get和post请求
代码如下: [AcceptVerbs("GET", "POST")] public HttpResponseMessage Http([FromUri]Prox ...
- 02-cookie案例-显示用户上次访问网站的时间
package cookie; import java.io.IOException;import java.io.PrintWriter;import java.util.Date; import ...
- js 第一篇（常用交互方法）
1. cocument.write("content") //向html 直接写入内容 2. alert("content") // 警告对话框 3. conf ...
- nginx教程2：日志
主要有两种:access_log(访问日志) 和 error_log(错误日志). access_log 访问日志 access_log 主要记录客户端访问 Nginx 的每一个请求,格式可以自定义. ...