HTML各知識點總結： 基本標簽 標題標簽、段落標簽、換行標簽、水平線標簽、字體樣式標簽、註釋和特殊符號 網頁插入 圖像、超鏈接，視頻、音頻、列表、表格、表單、內聯框架等 超鏈接 錨鏈接、功能性鏈接 列表 有序列表、無序列表、自定義列表 表格 行、列、跨行、跨列 表單 提交格式、文本框、密碼框、單選 ...
HTML各知識點總結：
| 基本標簽 | 標題標簽、段落標簽、換行標簽、水平線標簽、字體樣式標簽、註釋和特殊符號 |
| 網頁插入 | 圖像、超鏈接，視頻、音頻、列表、表格、表單、內聯框架等 |
| 超鏈接 | 錨鏈接、功能性鏈接 |
| 列表 | 有序列表、無序列表、自定義列表 |
| 表格 | 行、列、跨行、跨列 |
| 表單 | 提交格式、文本框、密碼框、單選框、多選框、下拉框 滑塊等 |
| 表單設置功能 | 隱藏區域、只讀模式、禁用模式 |
| 格式驗證 | 用戶提示（placehoder)、必填選項（required)、正則表達式（pattern) |
註：圖片或者音、視頻的路徑：
1、相對路徑：相對於代碼所在的路徑，返回上級目錄用“../”
2、絕對路徑：不考慮所寫代碼的路徑，直接複製圖片或者音、視頻的在盤符里的路徑
一、基本標簽：
註：標簽中的各個屬性是用 空格 隔開！
1、標題標簽：
給網頁中的正文設置標題，同時可選擇標簽大小。
用法說明：
一級標題h1,二級標題則h2，後者同理。
例如：一級標簽：
格式： <h1>標題名字</h1>
2、段落標簽：
給網頁中的內容分段，但是不具有空格和換行功能。
用法說明：
段落標簽用字元p表示
例如：
格式： <p>段落內容</p>
3、換行標簽：
給網頁中內容進行換行，不具有分段和空格功能，且與段落標簽相比，內容較顯的緊湊。
用法說明：
換行標簽用br表示，並且是單標簽
格式： 選擇換行內容<br/>(自閉合、建議使用)
或者 選擇換行內容<br>
4、水平線標簽：
給網頁中內容進行水平線分隔開。
用法說明：
水平線標簽用Hr表示，也是單標簽
格式： 選擇換行內容<hr/>(自閉合、建議使用)
或者 選擇換行內容<hr>
5、字體樣式標簽：
設置字體樣式，如粗體、斜體。
用法說明：
粗體：strong
斜體：em
格式： <strong> 內容 </strong>
<em> 內容 </em>
6、註釋和特殊符號：
網頁中所表示實際上的中、英或者數字等註釋和符號。
格式： 空格：內容1 內容2 大於號：內容1 > 內容2
小於號：內容1 < 內容2 版權符號：© 內容
二、網頁插入：
1、圖像：
在網頁中插入圖片。
格式 <img src="path" alt="text" title="text" width="x" height="y" />
其中 src: 圖像地址 alt: 圖像的替代文字（當圖片不存在或者找不到時，就會用alt中內容來表示這個圖片）
title: 懸停在圖片上的文字 width和height:設置圖片大小
2、超鏈接
在網頁中加入超鏈接，可以實現跳轉功能。
錨鏈接：
1、需要一個錨標記
錨標記可以在本頁面標記，在其他頁面實現跳轉； 也可以在其他頁面標記，在本頁面跳到標記的那個頁面。
2、知道要跳轉的頁面的網頁鏈接
格式： 錨標記： <a name="內容"></a> 有的版本用的是這個： <a id="內容"> </a>
錨鏈接： <a href="#內容（與錨標記中的內容是相同的）">回到錨標記對應的內容中</a>
功能性鏈接：
如郵件鏈接：mailto
格式： 郵件鏈接： <a href="mailto:此處輸入要跳轉的電子郵箱"> 點擊跳轉 </a>
3、列表：
用來列舉各種可能的事件或者種類等等。
有序列表：ol
無序列表：ul
自定義列表：dl
`<!--有序列表--> <ol>
<li> 內容 </li>
</ol>
<!--無序列表--> <ul>
<li> 內容 </li>
</ul>
<!--自定義列表--> <dl> <!--自定義列表-->
<dt> <!-- 列表名稱-->
<dd> 內容 </dd>
</dt>
</dl>`
4、表格：
用表格來顯示各個事物的各種屬性，簡單明瞭。
使用：
表格：table
行：tr
列：td
跨行：rowspan
跨列：colspan
`<table> <!--表格-->
<tr> 內容 <!--行-->
<td> 內容
<!--列-->
</td>
</tr>
</table>`
多行多列則在表格裡多寫幾個tr、td。具體事例如下代碼：
點擊查看代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格學習</title>
</head>
<body>
<!--表格標簽
tr:行標簽
td:列標簽
-->
<table>
<tr>
<!-- colspan 跨列-->
<td colspan="4">1-1</td>
</tr>
<!--rowspan 垮行-->
<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>
<td>3-3
</td>
<td>3-4
</td>
</tr>
<!-- 小練習-->
<tr>
<td colspan="3">學生成績</td>
</tr>
<tr>
<td rowspan="2">哈哈</td>
<td> 語文</td>
<td> 100</td>
</tr>
<tr>
<td> 數學</td>
<td> 100</td>
</tr>
<tr>
<td rowspan="2">嘻嘻</td>
<td> 語文</td>
<td> 100</td>
</tr>
<tr>
<td> 數學</td>
<td> 100</td>
</tr>
</table>
<table> <!--表格-->
<tr> <!--行-->
<td>
<!--列-->
</td>
</tr>
</table>
</body>
</html>
三、表單：
1、提交表單的形式：常用get/post （get方式提交，可以在url中看到用戶提交的信息，不安全，但是這種方式高效；post相對較安全，但是要想信息不被泄露仍需後期加密）
格式： <form method="get/post" action="發送地址"> 表單內容</form>
2、輸入框：
輸入框：input
比如輸入框、密碼框等等都用input標簽 ，標簽中的“type”的值決定了是輸入框還是其他標簽元素等等。並且儘量用“name”命名元素
type:
text(文本框)，password（密碼框），checkbox（多選框），radio（單選框），submit（提交），reset （重置），file（上傳文件），hidden（隱藏區域），image（圖片，點擊該圖片也可以提交表單），button（按鈕）等
value:
表單組件的初始值。當type為radio或者checkbox時，必須指定一個值。
size:
指定表單組件的初始寬度。當type為text或password時，表單元素的大小以字元為單位。而其他組件類型，寬度以像素為單位。
maxlength：
type為text或password時，輸入的最大字元數
checked：
type為radio或者checkbox時，表示指定按鈕已被選中，不可更改。
註：同一類型的單選框，name名稱必須一樣，不一樣則不為單選。
格式： 文本框：<input type="text" name="名字" > 密碼框：input type="password" name="名字" >
多選框：<input type="checkbox" name="名字"> 單選框：<input type="radio" name="名字">
提交：<input type="submit" name="名字"> 重置<input type="reset" name="名字">
上傳文件：<input type="file" name="名字"> 隱藏區域：<input type="hidden" name="名字">
圖片：<input type="image" name="名字"> 按鈕：<input type="button" name="名字">
3、下拉框：
下拉框：select
格式 <select name="下拉框的名稱">
<option value="選項的值1"> </option> （可在option標簽中加入selected表示已被選擇的選項）
<option value="選項的值2"> </option>
</select>
4、搜索框：
在網頁中添加搜索，可快速找到網頁中某個內容。
格式： <input type="search" name="名字">
5、滑塊：
類似音量調節的滑塊，可用來調節大小。
格式： <input type="range" max="滑塊所能滑的最大值" min="滑塊所能滑的最小值"> （滑塊對應的值要在表單提交後的網頁的網址上看到）
6、文件域：
上傳文件：file
格式： <input type="file" name="名字">
7、文本域：
多行文本：textarea
格式： <textarea name="名字" rows="行" cols="列"> 文本內容 </textarea>
表單的提交和重置：
提交：submit
重置：reset
格式 提交：<input type="submit" name="sub" src="提交地址">
或者以圖片形式提交：<input type="image" src="圖片地址" alt="圖片提交">
重置：<input type="reset" name="res" >
四、表單初級驗證：
判斷用戶輸入是否合理或者滿足條件，驗證失敗時，給出提示信息。
1、郵箱驗證：
格式： <input type="email" name="email">
2、URL驗證：
格式： <input type="url" name="url">
3、數字驗證：
格式： <input type="number" name="num"> (可在此標簽中加入max,min,step來設置數字範圍以及步長大小)
4、表單驗證之提示：
預設提示信息：placeholder（即在文本框中預設顯示的信息）可用在所有輸入框中，在單選、多選、下拉框中無意義。
必填選項：required （設置該項必填）
正則表達式：pattern （需要的可以在網上搜索）
五、表單其他功能：
隱藏某區域：hidden
設置只讀模式：readonly
禁用模式：disabled
註：可在標簽屬性後添加這幾個功能。如隱藏一個文本框：
格式： <input type="text" name="text" hidden>(表示該文本框已經隱藏）
滑鼠定位：實現點擊文字就能將滑鼠定位到對應的框中。
格式： <label for="鎖定滑鼠的id"> 內容如（用戶名）</label>
<input type="text" id="給這個文本框設置一個id名">
表單相關代碼：
`
