將 HTML 元素按功能進行分組。先簡單會彙總下，熟悉的放前面。
根元素:<html>
文件後設資料:<link>、<meta>、<style>、<style>
內容分割槽:<header>、<nav>、 <section>、<aside> 、<footer> 、<h1>~<h6> 、<article> 、<address>、<hgroup>
文字內容:<main>、<div>、<p>、<pre>、<ol>、 <ul>、<li>、<dl> 、<dt>、<dd>、<figure> 、<figcaption>、<blockquote> 、<hr>
內聯文字語義:
<span>、<a>、<strong>、<em>、<q>、<br>、<mark>、<code>、<abbr>、<b>、<bdi>、<bdo>、<sub>、<sup>、<time>、<i>、<u>、<cite>、<data>、<kbd>、<nobr>、<s>、<samp>、<tt>、<var>、<wbr>、<rp>、<rt>、<rtc>、<ruby>
圖片和多媒體:<img><audio> <video><track><map><area>
內嵌內容:<iframe>、<embed>、<object> 、<param>、<picture>、<source>
指令碼:<canvas>、<noscript>、<script>
編輯標識:<del>、<ins>
表格內容:<table>、<caption>、<thead>、<tbody>、<tfoot>、<tr>、、<col><colgroup>、<th>、<td>
表單:<form> 、<input>、<textarea> 、<label>、<button>、<datalist>、<fieldset>、<legend>、<meter>、<optgroup>、<option>、<output>、<progress>、<select>
互動元素<details>、<summary>、<dialog>、<menu>
Web 元件:<slot>、<template>
過時的和棄用的元素:<acronym><applet><basefont><bgsound><big><blink><center><command><content><dir><element><font><frame><frameset><image><isindex><keygen><listing><marquee><menuitem><multicol><nextid><nobr><noembed><noframes><plaintext><spacer><strike><shadow><tt><xmp>
複製程式碼1. 根元素
<html> HTML文件的根
複製程式碼2. 文件後設資料
後設資料（Metadata）含有頁面的相關資訊，包括樣式、指令碼及資料，能幫助一些軟體 (如搜尋引擎， 瀏覽器等等）更好地運用和渲染頁面。對於樣式和指令碼的後設資料，可以直接在網頁裡定義，也可以連結到包含相關資訊的外部檔案。
<link> 連結
<meta> 後設資料資訊，(<base>, <link>, <script>, <style> 或 <title>不能表示的後設資料資訊)
<style> 樣式資訊
<style> 文件標題
複製程式碼3. 內容分割槽
內容分割槽元素允許你將文件內容從邏輯上進行組織劃分。使用包括頁首(header)、頁尾(footer)、導航(nav)和標題(h1~h6)等分割槽元素，來為頁面內容建立明確的大綱，以便區分各個章節的內容。
<header> 表示一組引導性的幫助
<nav> 導航
<section> 表示文件中的一個區域（或節），通過是否含一個標題作為子節點來辨識<section>
<aside> 表示與其餘頁面無關的內容部分
<footer> 表示最近一個章節內容或者根節點元素的頁尾
<h1>~<h6> 標題
<article> 表示文件、頁面、應用或網站中的獨立結構
<address> 地址資訊
<hgroup> 代表一個段的標題
複製程式碼4. 文字內容
使用 HTML 文字內容元素來組織在開標籤 和閉標籤 裡的塊或章節的內容。這些元素能標識內容的宗旨或結構，而這對於 accessibility 和 SEO 很重要。
<main> 文件<body>或應用的主體部分
<div> 文件分割槽元素， 通用型流內容容器
<p> 段落
<pre> 預定義格式文字
<ol> 有序列表
<ul> 無序列表
<li> 列表條目元素
<dl> 描述列表元素
<dt>術語定義元素
<dd> 描述元素，描述列表 (<dl>) 的子元素，<dd>與 <dt> 一起用。
<figure> 代表一段獨立的內容, 經常與說明(caption) <figcaption> 配合使用
<figcaption>圖片說明/標題，於描述其父節點 <figure> 元素裡的其他資料
<blockquote> HTML 塊級引用元素
<hr>表示段落級元素之間的主題轉換，視覺上看是水平線
複製程式碼5. 內聯文字語義
使用 HTML 內聯文字語義(Inline text semantics)定義語句，結構，可以是一個詞，一段，或任意風格的文字。
<kbd> 表示使用者輸入
<span> 通用行內容器
<a> 超連結
<strong> 粗體顯示
<em> 標記出需要使用者著重閱讀的內容，可通過巢狀加深著重程度
<q> 短的引用文字
<br> 換行
<mark> 代表突出顯示的文字，可以用來顯示搜尋引擎搜尋後關鍵詞。
<code> 呈現一段計算機程式碼
<abbr> 縮寫，並可選擇提供一個完整的描述
<b>提醒注意，樣式和粗體類似（不要用於顯示粗體，用css font-weight來建立粗體）
<bdi> 雙向隔離元素
<bdo> 雙向覆蓋元素
<sub> 排低文字
<sup> 排高文字
<time> 時間
<i> 區分普通文字的一系列文字，內容通常以斜體顯示
<u> 使文字在其內容的基線下的一行呈現下劃線
<cite> 表示一個作品的引用
<data> 將一個指定內容和機器可讀的翻譯聯絡在一起。但如果內容是與 time 或者 date 相關的，一定要使用 <time>。
<dfn> 表示術語的一個定義
<kbd> 表示使用者輸入
<nobr> 阻止文字自動拆分成新行，不應該使用，應該使用css屬性
<s> 刪除線，提倡使用 <del> 和 <ins> 元素
<samp> 標識計算機程式輸出
<tt> 電報文字元素
<var> 表示變數的名稱，或者由使用者提供的值
<wbr> 一個文字中的位置，其中瀏覽器可以選擇來換行
<rp><rt><rtc><ruby>
複製程式碼6. 圖片和多媒體
HTML 支援各種多媒體資源，例如影象，音訊和視訊。
<img> 圖片
<audio> 音訊內容
<video> 視訊內容
<track> 被當作媒體元素—<audio> 和 <video>的子元素來使用。它允許指定計時字幕（或者基於事件的資料），例如自動處理字幕。
<map> 與 <area> 屬性一起使用來定義一個影象對映(一個可點選的連結區域).
<area> 在圖片上定義一個熱點區域，可以關聯一個超連結。<area>元素僅在<map>元素內部使用。
複製程式碼7. 內嵌內容
除了常規的多媒體內容，HTML 可以包括各種其他的內容，即使它並不容易互動。
<iframe> 表示巢狀的瀏覽上下文，有效地將另一個HTML頁面嵌入到當前頁面中。
<embed> 將外部內容嵌入文件中的指定位置
<object> 表示引入一個外部資源
<param> 定義了 <object>的引數
<picture> 容器，用來為其內部特定的 <img> 元素提供多樣的 <source> 元素。
<source> 資源
複製程式碼8. 指令碼
為了建立動態內容和 Web 應用程式，HTML 支援使用指令碼語言，最突出的就是 JavaScript。某些元素支援此功能。
<canvas> 通過指令碼（通常是JavaScript）繪製圖形
<noscript> 替代未執行指令碼
<script> 用於嵌入或引用可執行指令碼
複製程式碼9. 編輯標識
這些元素能標示出某個文字被更改過的部分。
<del> 表示一些被從文件中刪除的文字內容
<ins> 定義已經被插入文件中的文字
複製程式碼10. 表格內容
這裡的元素用於建立和處理表格資料。元素在一個 元素中可以出現一個或者更多。
<table> 表格
<caption> 表格的標題，通常作為 <table> 的第一個子元素出現
<thead> 表格頁首
<tbody> 表格主體
<tfoot> 表格頁尾
<tr> 行
<col> 列， 通常位於<colgroup>元素內
<colgroup> 表格列組
<th> 表頭
<td> 表格單元
複製程式碼11. 表單
HTML 提供了許多可一起使用的元素，這些元素能用來建立一個使用者可以填寫並提交到網站或應用程式的表單。
<form> 表單
<input> 輸入域
<textarea> 多行文字域
<label> 標題
<button> 按鈕
<datalist> 包含了一組<option>元素,這些元素表示其它表單控制元件可選值
<fieldset> 一組相關的表單元素，並使用外框包含起
<legend> 表示它的父元素<fieldset>的內容的標題
<meter> 顯示已知範圍的標量值或者分數值
<optgroup> 一個 <select> 元素中的一組選項
<option> 用於定義在<select>, <optgroup> 或<datalist> 元素中包含的項
<output> 表示計算或使用者操作的結果
<progress> 進度條
<select> 選項選單
複製程式碼12. 互動元素
HTML 提供了一系列有助於建立互動式使用者介面物件的元素。
<details>
<summary> 用作 一個<details>元素的一個內容的摘要，標題或圖例。
<dialog> 對話方塊
<menu> 選單
複製程式碼13. Web 元件
Web 元件是種近似 HTML（HTML-related） 的技術，這使得它能夠，從本質上講，建立和使用自定義元素，就好像它是普通的 HTML。此外，你甚至可以建立自定義版本的標準 HTML 元素。（注意：規範還沒有確定）
<slot> web元件技術的一部分，slot是web元件的一個佔位符
<template> 用於儲存客戶端內容的機制
複製程式碼14. 過時的和棄用的元素
<acronym><applet><basefont><bgsound><big><blink><center><command><content><dir><element><font><frame><frameset><image><isindex><keygen><listing><marquee><menuitem><multicol><nextid><nobr><noembed><noframes><plaintext><spacer><strike><shadow><tt><xmp>
複製程式碼15. 參考連結
- https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element
- http://www.runoob.com/html/html-tutorial.html