換行符：<br/>
首部:
<!DOCTYPE>: 說明html文件使用的標準, 在HTML5中僅為 <!DOCTYPE html>
1、頭標籤
- <head></head>：在head裡使用的標籤為頭標籤
- <title></title>:在標籤上顯示的內容
- <meta>:設定頁面的一些相關內容
- 實現頁面定時跳轉：<meta http-equiv=”refresh” content=”秒數;url=路徑” />
- <base />:設定超連結的一些內容
- <link />:引入外部檔案
- 屬性：
- rel:當前文件與被連結文件之間的關係
- type：被連結文件的 MIME 型別
- href：檔案路徑
- 引入css檔案:<link rel=”stylesheet” type=”text/css” href=”檔案路徑” />
- 屬性：
- <style></style>:定義樣式資訊，與css檔案相同
2、文字標籤和註釋標籤
- 文字標籤：修改文字樣式
- <font></font>
- 屬性：
- size:文字的大小，取值範圍1-7，超出7，預設是7
- color:文字顏色
- 兩種表示方式：
- 英文單詞：red green ……
- 使用十六進位制數表示 #ffffff
- 兩種表示方式：
- <b></b>:加粗
- <s></s>:刪除線
- <u></u>:下劃線
- <i></i>:斜體
- <pre></pre>:原樣輸出
- <sub></sub>:上角標
- <sup></sup>:下角標
- <p></p>:段落標籤，比br標籤多一行
- 註釋標籤
- <!– html的註釋 –>
3、標題標籤、水平線標籤和特殊字元
- 標題標籤
- <h1></h1> <h2></h2> ……<h6></h6>
- 從h1到h6，大小依次變小，同時自動換行
- 水平線標籤
- <hr/>
- 屬性：
- size:水平線的粗細，取值範圍1-7
- color:顏色
- 特殊字元
- < <
- > >
- 空格
- & &
4、列表標籤
- <dl> </dl>:表示列表的範圍
- 在dl裡面 <dt> </dt>:上層內容
- 在dl裡面 <dd> </dd>:下層內容
- <ol> </ol>:有序列表的範圍
- 屬性：type 設定排序方式 1 a i
- 在ol裡面 <li> 具體內容 </li>
- <ul> </ul>:無序列表的範圍
- 屬性：type 空心圓 circle 實心圓 disc 實心方塊 square 預設 disc
- 在ul裡面 <li> </li>
5、影像標籤
- <figure>
- 一般用於圖片的佈局
- <img />
- 屬性：
- src：圖片路徑
- width：圖片寬度
- height：圖片高度
- title: 當滑鼠放上去時顯示的文字
- alt：圖片讀取異常時顯示文字（圖片上顯示文字（相容性差））
- 屬性：
6、超連結標籤
- 連結資源
- <a> </a>
- 屬性：
- href:連結的資源地址
- target：設定開啟方式
- _blank: 在新視窗開啟
- _self: 在當前頁開啟(預設)
- framesetName: 在指定名稱的框架中開啟
- 屬性：
- <a> </a>
- 定位資源
- 定義位置
- <a> </a>
- 屬性：
- name: 位置名稱，定義一個位置
- href: 定位到指定名稱的位置處( this.html#name)
- 屬性：
- <a> </a>
- 定義位置
7、表格標籤
- <table> </table>: 表示表格的範圍
- <thead>和<tbody> 定義表格的標題與主題,標識作用
- 在table裡面 <caption> </caption>:設定標題
- 在table裡面 <tr> </tr>:表示行
- 在tr裡面 <td> </td>:表示列
- 在tr裡面 <th> </th>:相當於td的基礎上做了居中和加粗的操作
- table屬性：
- border：設定表格邊框的寬度
- bordercolor：設定表格邊框顏色
- cellspacing：設定單元格之間的距離
- width：表格寬
- height：表格高
- tr屬性：
- align：設定顯示方式 居左(left),居中(center),居右(right)
- td屬性：
- align：設定顯示方式 居左(left),居中(center),居右(right)
- rowspan：跨行的數量
- colspan:跨列的數量
8、表單標籤(註冊)
- <form> </form>: 定義一個表單的範圍
- 屬性：
- action：資料提交地址，預設當前路徑
- method：表單提交方式，有get(預設) post
- 屬性：
- <input />:輸入項
- input屬性：
- type：輸入項的型別
- text：普通輸入項
- number: 數字項
- password：密碼輸入項
- radio: 單選輸入項
- checkbox：複選輸入項
- file：檔案輸入項(為表單新增 enctype=”multipart/form-data” 屬性, 且method=”post”)
- accept: 指定上傳檔案格式
- hidden：隱藏項
- submin：提交按鈕
- image：圖片形式提交按鈕，src指定路徑
- reset：重置按鈕
- button：普通按鈕
- placeholder: 提示資訊(HTML5)
- name：元素名稱
- value: 元素值
- checked：預先選定核取方塊或單選按鈕
- readonly: 指定輸入框為只讀,不可編輯(布林值)
- disabled: 禁用輸入(布林值), 不可與 type 為 hidden 的同時出現
- required: 該項必須填寫
- pattern: 指定正規表示式, 與該表示式匹配才可以提交
- autofocus: 自動聚焦
- maxlength: 限制最大輸入長度
- type：輸入項的型別
- input屬性：
- <label></label>: 繫結表單控制元件
- for: 控制元件id, 當點選其中文字時, 焦點到該控制元件上
- <textarea> </textarea>:文字域
- textarea屬性：
- cols:列的數量
- rows:行的數量
- textarea屬性：
- <select> </select>:下拉的輸入項
- <option> </option>：選擇列表
- select 屬性：
- name
- option 屬性：
- value：元素值
- selected: 預選值
9、框架標籤
- <frameset></frameset>:定義框架集
- 在frameset裡面 <frame></frame>:frameset 中的一個特定的視窗
- frameset屬性：
- rows：按照行進行劃分，*代表剩下所有(200px, *)
- cols：按照列進行劃分，*代表剩下所有(200px, *)
- <noscript></noscript>: 其中的內容只有在瀏覽器不支援js或禁用了js時執行
10、內容標籤
- 無意義標籤(用來佈局):
- <div></div>:自動換行
- <span></span>:在一行顯示
- <nav>: 導航塊(HTML5)
- <header>: 頭部(HTML5)
- <footer>: 在頁面尾部顯示(HTML5)
- <section>: 表示頁面一個內容區塊,如章節,頁首等(HTML5)
- <article>: 表示獨立的內容,如文章等(HTML5)
- <aside>: 表示 article 的輔助資訊(HTML5)
- <bgroup>: 頁面中的標題(HTML5)
11. 影音標籤
- <video></video>: 視訊標籤(HTML5)
- <audio></audio>: 音訊標籤(HTML5)