## 1.介紹
- HTML 指的是超文本標記語言 (Hyper?Text?Markup?Language)
HTML 不是一種編程語言，而是一種標記語言?(markup language)? ?
標記語言是一套標記標簽?(markup tag)? ? HTML 使用標記標簽來描述網頁
## 2.標簽
- HTML 標簽是由尖括號包圍的關鍵詞，比如\<html>
- HTML 標簽通常是成對出現的(單個出現的叫自結束標簽)，比如 \<b>和\</b>? ?標簽對中的第一個標簽是開始標簽，第二個標簽是結束標簽?
- 開始和結束標簽也被稱為開放標簽和閉合標簽
meta標簽用來設置網頁的一些元數據，比如網頁的字符集，關鍵字、簡介。
- meta是一個自結束標簽，編寫一個自結束標簽時，可以在開始標簽中添加一個/。
\<meta name="description" content="這是我寫的一個酷炫的網站。">
\<meta name="author" content="myname" />
- 使用meta標簽還可以用來設置網頁的關鍵字。
\<meta name="keywords" content="HTML5,JavaScript,前端,Java" />
- 還可以用來指定網頁的描述，搜索引擎在檢索頁面時，會同時檢索頁面中的關鍵詞和描述，但是這兩個值不會影響頁面在搜索引擎中的排名。
\<meta name="description" content="發布h5、js等前端相關的信息" />
- 使用meta可以用來做請求的重定向。
\<meta http-equiv="refresh" content="秒數;url=目標路徑" />
\<meta http-equiv="refresh" content="5;url=http://www.baidu.com" /> 5s后重定向到百度
## 3.常用標簽
1. HTML 標題（Heading）是通過 \<h1>-\<h6>等標簽進行定義的。\<h1>定義最大的標題\<h6>定義最小的標簽。
2. HTML 段落是通過\<p>標簽進行定義的。
3. HTML 鏈接是通過\<a>標簽進行定義的。
//注釋：在 href 屬性中指定鏈接的地址。
4. HTML 圖像是通過\<img>標簽進行定義的。
//注釋：圖像的名稱和尺寸是以屬性的形式提供的
5. 大多數 HTML 元素可以嵌套（可以包含其他 HTML 元素）。
6. 沒有內容的 HTML 元素被稱為空元素。空元素是在開始標簽中關閉的。\<br>就是沒有關閉標簽的空元素（\<br>標簽定義換行）。
7. 標簽內容最好都是小寫。
8. HTML 標簽可以擁有屬性。屬性提供了有關 HTML 元素的更多的信息。屬性總是以名稱/值對的形式出現，
比如：name="value"。屬性總是在 HTML 元素的開始標簽中規定。
屬性值應該始終被包括在引號內。雙引號是最常用的
9. \<hr>標簽在 HTML 頁面中創建水平線。\<hr> 元素可用于分隔內容。使用水平線 \<hr>標簽來分隔文章中的小節是一個辦法（但并不是唯一的辦法）。
10. 可以將注釋插入 HTML 代碼中，這樣可以提高其可讀性，使代碼更易被人理解。瀏覽器會忽略注釋，也不會顯示它們。
//注釋：開始括號之后（左邊的括號）需要緊跟一個嘆號，結束括號之前（右邊的括號）不需要。
提示：合理地使用注釋可以對未來的代碼編輯工作產生幫助。
11. 超鏈接\<a>標簽的使用：
~~~html
<!--
1).跳到外部頁面
href里面寫路徑地址。target屬性表示打開方式，具體如下
_self:自身窗口打開 _blank:新窗口打開 _top:跳到當前頁面頂部
2).打開本地資源，如前面已經寫好的頁面
href里面寫路徑，也滿足相對，絕對路徑原則
3).找到一個錨點
如何使用：
@1,給一個標簽設置id屬性，那么這個這個標簽就可以作為一個錨點
@2,使用<a href="#錨點的id值">..</a>
@ 單獨一個"#"表示調到當前頁面頂部，與_top相同
4).還可以發郵件，打電話（用于移動端）,QQ
href里面寫mailto:郵件地址
tel:電話號碼
5).找到超鏈接，用text-decortion可去掉下劃線
-->
~~~
12. name 屬性規定錨（anchor）的名稱。您可以使用 name 屬性創建 HTML 頁面中的書簽。書簽不會以任何特殊方式顯示，它對讀者是不可見的。
當使用命名錨（named anchors）時，我們可以創建直接跳至該命名錨（比如頁面中某個小節）的鏈接，這樣使用者就無需不停地滾動頁面來尋找他們需要的信息了。
>[info] 錨的名稱可以是任何你喜歡的名字。
>您可以使用 id 屬性來替代 name 屬性，命名錨同樣有效。
13. 圖像標簽\<img>：
使用img標簽來向網頁中引入一個外部圖片。img標簽也是一個自結束標簽。
- 屬性：
- src：設置一個外部圖片的路徑。
- alt：可以用來設置在圖片不能顯示時，對圖片的描述。搜索引擎可以通過alt屬性來識別不同的圖片。如果不寫alt屬性，則搜索引擎不會對img中的圖片進行收錄。
- title:當鼠標移動到圖片上顯示的內容。
- width：可以用來修改圖片的寬度,一般使用px作為單位。
- height：可以用來修改圖片的高度，一般使用px作為單位。
寬度和高度兩個屬性如果指設置一個，另一個也會同時等比例調整大小如果兩個值同時指定則按照你指定的值來設置，一般開發中除了自適應的頁面(根據設備不同，顯示效果不一樣)，不建議設置width和height。
> src屬性配置的是圖片的路徑，目前我們所要使用的路徑全都是相對路徑。
>[info]相對路徑：相對路徑指相對于當前資源所在目錄的位置，可以使用../來返回一級目錄,返回幾級目錄就寫幾個../
\<img src="abc/bcd/2.gif" alt="這是一個大松鼠"/>
\<img src="../../img/2.gif" alt="這是一個大松鼠"/>
14. 特殊字符：
在HTML中，一些如< >這種特殊字符是不能直接使用，需要使用一些特殊的符號來表示這些特殊字符，這些特殊符號我們稱為實體（轉義字符串）。瀏覽器解析到實體時，會自動將實體轉換為其對應的字符
實體的語法：&實體的名字;
< \< > \> 空格 \ 版權符號 \© \÷ ÷
15. 表格由\<table> 標簽定義。每行被分割為若干單元格（由 \<tr> 標簽定義）。字母 \<td> 指表格數據（table data），即數據單元格的內容。
> 數據單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。表格的表頭使用\<th>標簽進行定義。
16. 無序列表是一個項目的列表，此列項目使用粗體圓點（典型的小黑圓圈）進行標記。無序列表始于\<ul>標簽。每個列表項始于\<li>標簽。
17. 有序列表也是一列項目，列表項目使用數字進行標記。有序列表始于\<ol>標簽。每個列表項始于\<li>標簽。
18. 自定義列表不僅僅是一列項目，而是項目及其注釋的組合。自定義列表以\<dl>標簽開始。每個自定義列表項以\<dt>開始。每個自定義列表項的定義以\<dd>開始。
19. 塊狀元素：\<h1>-\<h6> ?\<p> ?\<ul> ?\<table> ?\<li> ?行類元素：\<b> ? \<td> ? \<a> ?\<img>
20. 背景顏色屬性將背景設置為某種顏色。屬性值可以是十六進制數、RGB(255,255,255)值(0-255)或顏色名。
## 4.圖片的格式
- JPEG(JPG)- JPEG圖片支持的顏色比較多，圖片可以壓縮，但是不支持透明，一般使用JPEG來保存照片等顏色豐富的圖片。
- GIF- GIF支持的顏色少，只支持簡單的透明，支持動態圖，圖片顏色單一或者是動態圖時可以使用gif。
- PNG- PNG支持的顏色多，并且支持復雜的透明，可以用來顯示顏色復雜的透明的圖片。
>[info] 圖片的使用原則：效果不一致，使用效果好的。效果一致，使用小的。
> 編寫一段內容，在純文本編輯器中編寫的內容都是純文本，網頁就是使用純文本編寫的。純文本中只能保持文本內容。圖片，音頻，視頻等格式化的內容，都不能設置。
>[info]元素的自定義屬性：在HTML中能自定義屬性的只有如下：id（不允許重復）、 class、 name（可重復）
