1.列表
1.无序列表(ul-li)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>无序列表</title>
</head>
<body>
<p>
<ul>
<li> 数学</li>
<li> 语文</li>
<li> 英语</li>
<li> 物理</li>
<li> 化学</li>
</ul>
</p>
</body>
</html>
2.有序列表(ol-li)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>有序列表</title>
</head>
<body>
<p>
<ol>
<li> 数学</li>
<li> 语文</li>
<li> 英语</li>
<li> 物理</li>
<li> 化学</li>
</ol>
</p>
</body>
</html>
3.自定义列表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>自定义列表</title>
</head>
<body>
<p>
<dl>
<dt>水果</dt>
<dd>苹果</dd>
<dd>梨子</dd>
<dd>香蕉</dd>
<dd>葡萄</dd>
<dd>苹果</dd>
<dd>梨子</dd>
<dd>香蕉</dd>
<dd>葡萄</dd>
</dl>
</p>
</body>
</html>
2.表格
基本结构：
- 表格 table
- 行 tr rowspan
- 列 td colspan
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格标签</title>
</head>
<body>
<p>
<table border="1px">
<!--<tr>行<td>列-->
<tr>
<!--colspan跨列-->
<td colspan="2">1-1 1-2</td>
<td>1-3</td>
</tr>
<tr>
<!--rowspan跨行-->
<td rowspan="2">2-1 <br>3-1</td>
<td>2-2</td>
<td>2-3</td>
</tr>
<tr>
<td>3-2</td>
<td>3-3</td>
</tr>
</table>
</p>
</body>
</html>
3.媒体元素
1.视频标签video
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>视频</title>
</head>
<body>
<!--video 视频标签
src：视频的路径
controls: 提供播放按钮，进度条、下载按钮、全屏按钮、音量控制
autoplay： 自动播放
loop: 循环播放
-->
<!--<video src="../statics/video/china.mp4" controls autoplay></video>-->
<video controls autoplay>
<source src="../statics/video/china.mp4">
<source src="../statics/video/china.mp4">
</video>
</body>
</html>
2.音频标签audio
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--音频播放-->
<audio src="../statics/audio/ab410f7bbbb0955e7ae476ae89527a5d.m4a" autoplay controls>
</audio>
</body>
</html>