HTML 速查列表

HTML 基本文檔

< ! DOCTYPE html > < html > < head > < title > 文檔標題 </ title > </ head > < body > 可見文本... </ body > </ html >

基本標籤（Basic Tags）

< h1 > 最大的標題 </ h1 > < h2 > . . . </ h2 > < h3 > . . . </ h3 > < h4 > . . . </ h4 > < h5 > . . . </ h5 > < h6 > 最小的標題 </ h6 > < p > 這是一個段落。 </ p > < br > （換行） < hr > （水平線） <!-- 這是註釋 -->

文本格式化（Formatting）

< b > 粗體文本 </ b > < code > 計算機代碼 </ code > < em > 強調文本 </ em > < i > 斜體文本 </ i > < kbd > 鍵盤輸入 </ kbd > < pre > 預格式化文本 </ pre > < small > 更小的文本 </ small > < strong > 重要的文本 </ strong > < abbr > （縮寫） < address > （聯繫信息） < bdo > （文字方向） < blockquote > （從另外一個源引用的部分） < cite > （工做的名稱） < del > （刪除的文本） < ins > （插入的文本） < sub > （下標文本） < sup > （上標文本）

連接（Links）

普通的連接： < a href = " http://www.example.com/ " > 連接文本 </ a > 圖像連接： < a href = " http://www.example.com/ " > < img src = " URL " alt = " 替換文本 " > </ a > 郵件連接： < a href = " mailto:webmaster@example.com " > 發送e-mail </ a > 書籤： < a id = " tips " > 提示部分 </ a > < a href = " #tips " > 跳到提示部分 </ a >

---

圖片（Images）

< img src = " URL " alt = " 替換文本 " height = " 42 " width = " 42 " >

---

樣式/區塊（Styles/Sections）

< style type = " text/css " >

h1 { color: red ; } p { color: blue ; }

</ style > < div > 文檔中的塊級元素 </ div > < span > 文檔中的內聯元素 </ span >

無序列表

< ul > < li > 項目 </ li > < li > 項目 </ li > </ ul >

---

有序列表

< ol > < li > 第一項 </ li > < li > 第二項 </ li > </ ol >

---

定義列表

< dl > < dt > 項目 1 </ dt > < dd > 描述項目 1 </ dd > < dt > 項目 2 </ dt > < dd > 描述項目 2 </ dd > </ dl >

表格（Tables）

< table border = " 1 " > < tr > < th > 表格標題 </ th > < th > 表格標題 </ th > </ tr > < tr > < td > 表格數據 </ td > < td > 表格數據 </ td > </ tr > </ table >

---

框架（Iframe）

< iframe src = " demo_iframe.htm " > </ iframe >

表單（Forms）

< form action = " demo_form.php " method = " post/get " > < input type = " text " name = " email " size = " 40 " maxlength = " 50 " > < input type = " password " > < input type = " checkbox " checked = " checked " > < input type = " radio " checked = " checked " > < input type = " submit " value = " Send " > < input type = " reset " > < input type = " hidden " > < select > < option > 蘋果 </ option > < option selected = " selected " > 香蕉 </ option > < option > 櫻桃 </ option > </ select > < textarea name = " comment " rows = " 60 " cols = " 20 " > </ textarea > </ form >

 

實體（Entities）

&lt; 等同於 < & gt ; 等同於 > &#169; 等同於 ©

 

HTML 速查列表

---

HTML 速查列表. 你能夠打印它，以備平常使用。

---

HTML 基本文檔

< ! DOCTYPE html > < html > < head > < title > 文檔標題 </ title > </ head > < body > 可見文本... </ body > </ html >

---

基本標籤（Basic Tags）

< h1 > 最大的標題 </ h1 > < h2 > . . . </ h2 > < h3 > . . . </ h3 > < h4 > . . . </ h4 > < h5 > . . . </ h5 > < h6 > 最小的標題 </ h6 > < p > 這是一個段落。 </ p > < br > （換行） < hr > （水平線） <!-- 這是註釋 -->

---

文本格式化（Formatting）

< b > 粗體文本 </ b > < code > 計算機代碼 </ code > < em > 強調文本 </ em > < i > 斜體文本 </ i > < kbd > 鍵盤輸入 </ kbd > < pre > 預格式化文本 </ pre > < small > 更小的文本 </ small > < strong > 重要的文本 </ strong > < abbr > （縮寫） < address > （聯繫信息） < bdo > （文字方向） < blockquote > （從另外一個源引用的部分） < cite > （工做的名稱） < del > （刪除的文本） < ins > （插入的文本） < sub > （下標文本） < sup > （上標文本）

---

連接（Links）

普通的連接： < a href = " http://www.example.com/ " > 連接文本 </ a > 圖像連接： < a href = " http://www.example.com/ " > < img src = " URL " alt = " 替換文本 " > </ a > 郵件連接： < a href = " mailto:webmaster@example.com " > 發送e-mail </ a > 書籤： < a id = " tips " > 提示部分 </ a > < a href = " #tips " > 跳到提示部分 </ a >

---

圖片（Images）

< img src = " URL " alt = " 替換文本 " height = " 42 " width = " 42 " >

---

樣式/區塊（Styles/Sections）

< style type = " text/css " >

h1 { color: red ; } p { color: blue ; }

</ style > < div > 文檔中的塊級元素 </ div > < span > 文檔中的內聯元素 </ span >

---

無序列表

< ul > < li > 項目 </ li > < li > 項目 </ li > </ ul >

---

有序列表

< ol > < li > 第一項 </ li > < li > 第二項 </ li > </ ol >

---

定義列表

< dl > < dt > 項目 1 </ dt > < dd > 描述項目 1 </ dd > < dt > 項目 2 </ dt > < dd > 描述項目 2 </ dd > </ dl >

---

表格（Tables）

< table border = " 1 " > < tr > < th > 表格標題 </ th > < th > 表格標題 </ th > </ tr > < tr > < td > 表格數據 </ td > < td > 表格數據 </ td > </ tr > </ table >

---

框架（Iframe）

< iframe src = " demo_iframe.htm " > </ iframe >

---

表單（Forms）

< form action = " demo_form.php " method = " post/get " > < input type = " text " name = " email " size = " 40 " maxlength = " 50 " > < input type = " password " > < input type = " checkbox " checked = " checked " > < input type = " radio " checked = " checked " > < input type = " submit " value = " Send " > < input type = " reset " > < input type = " hidden " > < select > < option > 蘋果 </ option > < option selected = " selected " > 香蕉 </ option > < option > 櫻桃 </ option > </ select > < textarea name = " comment " rows = " 60 " cols = " 20 " > </ textarea > </ form >

---

實體（Entities）

&lt; 等同於 < & gt ; 等同於 > &#169; 等同於 ©