列表,表格,与媒体元素
列表
一.无序列表
基本语法
<ul>
<li>...</li>
</ul>
无序列表的特性
- 没有顺序,每个
<li>
标签独占一行(块元素) - 默认
<li>
标签项前面有个实心小圆点 - 一般用于无序类型的列表,如导航、侧边栏新闻、有规律的图文组合模块等
示例
二.有序列表
基本语法
<ol>
<li>...</li>
</ol>
有序列表的特性
- 有顺序,每个
<li>
标签独占一行(块元素) - 默认
<li>
标签项前面有顺序标记 - 一般用于排序类型的列表,如试卷、问卷选项等
示例
三.定义列表
基本语法
<dl>声明定义列表
<dt>...</dt>声明列表项
<dd>...</dd>定义列表项内容
</dl>
定义列表的特性
- 没有顺序,每个
<dt>
标签、<dd>
标签独占一行(块元素) - 默认没有标记
- 一般用于一个标题下有一个或多个列表项的情况
示例
表格
一.表格的基本语法
<table>表格标签
<tr>行标签
<td>第1个单元格的内容</td>单元格标签
<td>第2个单元格的内容</td>
……
</tr>
<tr>
<td>第1个单元格的内容</td>
<td>第2个单元格的内容</td>
……
</tr>
</table>
二.表格的跨行
<table >
<tr>
<td rowspan="n"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
</table>
三.表格的跨列
<table>
<tr>
<td colspan="n">单元格内容</td>
</tr>
<tr>
<td>单元格内容</td>
……
</tr>
......
</table>
四.表格的跨行和跨列
……
<tr>
<td colspan="3">学生成绩</td>
</tr>
<tr>
<td rowspan="2">张三</td>
<td>语文</td>
<td>98</td>
</tr>
……
五.示例
媒体元素
一.视频元素(video)
语法
<video src="视频路径" controls></video>
或者
<video controls>
<source src="video/video.webm" type="video/webm"/>
<source src="video/video.mp4" type="video/mp4"/>
</video>
示例
二.音频元素(audio)
语法
<audio src="音频路径" controls></video>
或者
<audio controls>
<source src="music/music.mp3" type="audio/mpeg"/>
<source src="music/music.ogg" type="audio/ogg"/>
你的浏览器不支持audio元素
</audio>
示例
内联框架
一.语法
<iframe src="path" name="mainFrame" ></iframe>