列表标签
什么是列表:
- 列表就是信息资源的一种展示形式。它可以使信息结构化和条理化,并以列表的样式显示出来,以便浏览者能更快捷地获得相应的信息
列表的分类:
- 无序列表 ol(Ordered list)
- 有序列表 ul (Unordered list)
- 自定义列表
示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--有序列表-->
<ol>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ol>
<hr>
<!--无序列表-->
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
<!--
自定义列表
dl: 标签
dt: 列表名称
dd: 列表内容
-->
<dl>
<dt>数字</dt>
<dd>1</dd>
<dd>2</dd>
<dd>3</dd>
<dt>数字(中文)</dt>
<dd>壹</dd>
<dd>贰</dd>
<dd>叁</dd>
</dl>
</body>
</html>
运行结果:
表格标签
示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--
表格 table
行 tr(table rows)
列 td
-->
<table border="1px">
<tr>
<!--colspan跨列-->
<td colspan="4">1-1</td>
</tr>
<tr>
<!--rowspan跨行-->
<td rowspan="2">2-1</td>
<td>2-1</td>
<td>2-2</td>
<td>2-3</td>
</tr>
<tr>
<td>3-1</td>
<td>3-2</td>
<td>3-3</td>
</tr>
</table>
</body>
</html>
运行结果:
媒体元素(vedio & audio)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--视频
video
controls: 控制条
autoplay: 自动播放
-->
<video src="resources/vedio/蛇蛇.mp4" controls autoplay></video>
<!--音频
audio
controls: 控制条
autoplay: 自动播放-->
<audio src="resources/audio/星沉大海.mp3" controls autoplay></audio>
</body>
</html>
运行结果: