第一章 HTML標簽介紹
第一節 HTML基本結構
<!DOCTYPE html> <html><head><title>標題</title></head><body>文檔主體</body></html>- HTML 標簽是由<>包圍的關鍵詞，例：<html>
- HTML 標簽通常成對出現，分為標簽開頭和標簽結尾，例：<html> </html>
- 有部分標簽是沒有結束標簽，成為單標簽，單標簽內必須用 / 結尾，例：<br/><hr/>
- 頁面中所有的內容，都要放在HTML標簽中
- HTML標簽主體分為三個部分
- 標簽名稱
- 標簽內容
- 標簽屬性
- HTML 標簽具有語義化
- 語義化：就是僅通過標簽名就能判斷出該標簽的內容。
- 語義化的作用
- 網頁結構層次更清晰。
- 更容易被搜索引擎收錄。
- 更容易讓屏幕閱讀器讀出網頁內容。
- 標簽的內容就是在一對標簽內部的內容
- 標簽的內容可以是其他標簽
第二節 標簽（元素）全局標準屬性
在HTML規范中，規定了全局標準屬性：
class屬性
- 用于定義元素的類名。
id屬性
- 用于指定元素的唯一id
- 要注意該屬性的值在整個HTML文檔中要具有唯一性
注意：
- 屬性和屬性值，盡量小寫，本來這樣做也方便些。
- class 屬性可以多用 class=" " （引號里面可以填入多個class屬性）
- id 屬性只能單獨設置 id=" "（只能填寫一個，多個無效）
style屬性
- 用于指定元素的行內樣式
- 使用該屬性后將會覆蓋任何全局的樣式設定
title屬性
- 用于指定元素的額外信息
dir屬性
- 用于指定元素中內容的文本方向
- 屬性值只有ltr或rtl兩種，含義分別是left to right和right to left。
lang屬性
- 用于指定元素內容的語言
第三節 HTML的全局事件屬性
Window窗口事件
- onload：在頁面加載結束之后觸發。
- onunload：在用戶從頁面離開時發生，例如點擊跳轉，頁面重載，關閉瀏覽器窗口等。
Form表單事件
- onblur：當元素失去焦點時觸發。
- onchange：在元素的元素值被改變時觸發。
- onfocus：當元素獲得焦點時觸發。
- onreset：當表單中的重置按鈕被點擊時觸發。
- onselect：在元素中文本被選中后觸發。
- onsubmit：在提交表單時觸發。
Keyboard鍵盤事件
- onkeydown：在用戶按下按鍵時觸發。
- onkeypress：在用戶按下按鍵后，按著按鍵時觸發。該屬性不會對所有按鍵生效，不生效的有：ALT、CTRL、SHIFT、ESC
- onkeyup：當用戶釋放按鍵時觸發。
Mouse鼠標事件
- onclick：當在元素上發生鼠標點擊時觸發。
- onblclick：當在元素上發生鼠標雙擊時觸發。
- onmousedown：當在元素上按下鼠標按鈕時觸發。
- onmousemove：當鼠標指針移動到元素上時觸發。
- onmouseout：當鼠標指針移出元素時觸發。
- onmouseover：當鼠標指針移動到元素上時觸發。
- onmouseup：當在元素上釋放鼠標按鈕時觸發。
- Media媒體事件
- onabort：當退出時觸發。
- onwaiting：當媒體已停止播放但打算繼續播放時觸發。
第二章 HTML的標簽（元素）
第一節 文本標簽
段落標簽 <p></p>
段落標簽用來描述一段文字
標題標簽 <hx></hx>
- 標題標簽用來描述一個標題
- 標題標簽總共有六個級別，由高到低分別是h1,h2,h3,h4,h5,h6
<h1>我是一級標題</h1>
<h2>我是二級標題</h2>
<h3>我是三級標題</h3>
<h4>我是四級標題</h4>
<h5>我是五級標題</h5>
<h6>我是六級標題</h6>- <h1></h1>標簽在每個頁面中通常只出現一次
強調語句標簽<em></em>
用于強調某些文字的重要性
更加強調標簽<strong></strong>
和 <em>標簽一樣，用于強調文本，但它強調的程度更強一些
無語義標簽<span></span>
<span>標簽是沒有語義。
短文本引用標簽<q></q>
簡短文字的引用。
長文本引用標簽<blockquote></blockquote>
定義長的文本引用
換行標簽<br/>
<br/>標簽作用相當于word文檔中的回車,起到文字換行的作用
第二節 多媒體標簽
鏈接標簽 <a></a>
圖片標簽 <img/>
視頻標簽<video></video>
- <video src="mov.mp4" controls="controls">
- 目前video支持三種視頻格式
- Ogg = 帶有 Theora 視頻編碼和 Vorbis 音頻編碼的 Ogg 文件
- MPEG4 = 帶有 H.264 視頻編碼和 AAC 音頻編碼的 MPEG 4 文件
- WebM = 帶有 VP8 視頻編碼和 Vorbis 音頻編碼的 WebM 文件
音頻標簽<audio></audio>
<audio src="a01.mp3"></audio>第三節 列表
無序列表標簽<ul><li><li/></ul>
- ul-li是沒有前后順序的信息列表
- <ul><ul/>列表定義一個無序列表
- <li><li/>代表無需列表中的每一個元素
<ul>
<li>HTML<li/>
<li>CSS<li/>
<li>JavaScript<li/>
</ul>有序列表<ol><li><li/></ol>
ol-li列表默認情況下，每個li在瀏覽器中都會顯示一個數字，代表自己的序號
定義列表<dl></dl>
- 定義列表通常和<dt></dt>和<dd></dd>標簽一起使用
- <dt></dt>定義列表中的項目
- <dd></dd>描述列表中的項目
<dl>
<dt>學習WEB前段需要掌握哪三種語言</dt>
<dd>需要掌握HTML，搭建網頁結構</dd>
<dd>需要掌握CSS，用于修改網頁結構的樣式</dd>
<dd>需要掌握JavaScript，用于用戶和計算機交互</dd>
</dl>第四節 表格
表格標簽<table></table>
表格的一行<tr></tr>
有幾對tr, 表格就有幾行。
表格的表頭<th></th>
表格的頭部的一個單元格，表格表頭。
單元格<td></td>
- 表格的一個單元格，一行中包含幾對<td><td/>，說明一行中就有幾列。
<table>
<tr>
<th>姓名</th>
<th>性別</th>
<th>年齡</th>
</tr>
<tr>
<td>張三</td>
<td>男</td>
<td>25</td>
</tr>
<tr>
<td>小花</td>
<td>女</td>
<td>23</td>
</tr>
<tr>
<td>李四</td>
<td>男</td>
<td>28</td>
</tr>
</table>表格合并
- 同一行內，合并幾列colspan=“2”
- 同一列內，合并幾行rowspan="3"
第五節 表單標簽系列
表單標簽<form>
- <form></form>表單是可以把瀏覽者輸入的數據傳送到服務器端，這樣服務器端程序就可以處理表單傳過來的數據。
- <form method="傳送方式" action="服務器文件">
- action ：瀏覽者輸入的數據被傳送到的地方,比如一個PHP頁面(save.php)
- method ： 數據傳送的方式（get/post）
 深度優先遍歷 暴力搜索 C++解題思路 每日一題)
)
