行內元素和塊元素
- 塊元素：無論多少內容，該元素獨佔一行（p，h1~h6）
- 行內元素：內容撐開寬度，左右都是行內元素的可以排在一行（a，strong，em…）
列表標籤
列表就是信息資源的一種展示形式，它使信息更加條理化和結構化，並以列表的形式展出。
列表的分類：
1.有序列表
<ol>
<li>內容</li>
...
</ol>
2.無序列表
<ul>
<li>內容</li>
...
</ul>
3.自定義列表
<dl>
<dt>列表名稱</dt>
<dd>內容</dd>
<dd>內容</dd>
...
</dl>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>列表</title>
</head>
<body>
<!--有序列表
應用：試卷，問答...
-->
<ol>
<li>java</li>
<li>Python</li>
<li>Linux</li>
</ol>
<hr/>
<!--無序列表
應用：導航，側邊欄...
-->
<ul>
<li>java</li>
<li>Python</li>
<li>Linux</li>
</ul>
<hr/>
<!--自定義列表
dl:標籤
dt:列表名稱
dd:列表內容
應用：公司網站底部
-->
<dl>
<dt>學科</dt>
<dd>Java</dd>
<dd>Python</dd>
<dd>Linux</dd>
</dl>
</body>
</html>
表格標籤
基本結構：單元格，行，列，跨行，跨列
表格使用的標籤是：table表格標籤，table標籤內部，有行標籤，列標籤
行：tr 列：td 列在行的內部
<table>
<!--行-->
<tr>
<!--列-->
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格練習</title>
</head>
<body>
<!--表格標籤table
行：tr 列：td
border:給表格加邊框，1px代表1像素值
跨行跨列在td標籤內實現
跨行操作：colspan="幾列" rowspan="幾行"
colspan是跨列，跨列幾列，這一行剩下幾列的可以刪除
rowspan是跨行，跨行後，這一列剩下的可以刪除
使用 align="center" 實現居中效果
-->
<table border="1px">
<!--行標籤-->
<tr>
<!--列標籤-->
<td colspan="3" align="center">1-1</td>
</tr>
<tr>
<td rowspan="2">2-1</td>
<td>2-2</td>
<td>2-3</td>
</tr>
<tr>
<td>3-1</td>
<td>3-2</td>
</tr>
</table>
</body>
</html>
媒體元素
視頻元素：video 音頻元素：audio
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>媒體元素</title>
</head>
<body>
<!--音頻和視頻
video視頻：
src:資源路徑
controls:控制條
autoplay：自動播放
muted:解決不能自動播放，但是這個是關閉聲音的
audio音頻：
-->
<!--視頻-->
<!--<video src="../resources/video/虹之間.mp4" muted controls autoplay></video>-->
<!--音頻-->
<audio src="../resources/audio/憂傷還是快樂.mp3" controls autoplay></audio>
</body>
</html>