第二章 表格,列表,媒体元素
一.列表
1.无序列表
语法:<ul>
<li>-</li>
....
<li>-<li>
</ul>
特点:1.没有顺序,每个li元素独占一行(块级元素)
2.默认每个li元素前有一个实心的小圆点
3.一般用于无序类型的列表,如导航、侧边栏新闻、有规律的图文组合模块等
注意:
1.遵循W3C标准,ul标签下只能有li标签,但是li标签下可以包含任何标签
1.2有序列表
语法:
<ol>
<li>***</li>
<li>***</li>
</ol>
特点:1.有顺序,每个li元素独占一行
2.默认每个li元素前有顺序标识1,2,3
3.一般用于排序类型的列表,例如:问卷调查,
1.3定义列表
语法:
<dl>
<dt>标题1</dt>
<dd>标题1的内容1</dd>
<dd>标题1的内容2</dd>
<dt>标题2</dt>
<dd>标题2的内容1</dd>
<dd>标题2的内容2</dd>
</dl>
特点:1.没有顺序,每个dt和dd标签独占一行
2.默认没有标记
3.一般用于一个标题下有 一个或者多个列表选项
二.表格
1.表格的跨行与夸列 <语法>
表格夸列
<table>
<tr>
<td rowspan="所夸的列数">单元格内容</td>
</tr>
</table>
表格跨行
<table>
<tr>
<td colspan="所夸的列数">单元格内容</td>
</tr>
</table>
三.媒体元素
1.视频元素:
语法:
<video src="视频路径"controls="controls"></video>
video元素的应用
<video controls>
<source src="视频地址"/>
</video>
2.音频元素
语法:
<audio src="音频路径"controls="controls"></audio>
音频元素的应用:
<audio controls>
<source src="音频路径"/>
</audio>
四.HTML5的结构元素
<head lang="en">
<meta charset="UTF-8">
<title>标题</title>
<style>
header{
height:90px ;
border: 0px solid black; //头部
}
section{
height: 500px;
border: 0px solid black ; //主题
}
footer{
height: 160px; //尾部
border: 0px solid black;
}
</style>
</head>
五:<iframe>框架
<iframe>框架的语法
<iframe src="引用页面地址"name="框架表示名"></iframe>
<iframe>使用
<iframe src="引用页面地址"name="***">
<a href="www.baidu.com"target="***"></a>