HTML 元素參考

此頁面列出了所有 HTML 元素，這些元素是使用 標籤 建立的。

它們按功能分組，以幫助您輕鬆找到所需內容。所有元素的字母順序列表也提供在每個元素的頁面以及此頁面的側邊欄中。

注意：有關 HTML 元素和屬性基礎知識的更多資訊，請參閱 HTML 簡介文章中有關元素的部分。

主根

元素 描述
<html> 表示 HTML 文件的根（頂級元素），因此也稱為根元素。所有其他元素必須是此元素的後代。

文件元資料

元資料包含有關頁面的資訊。 這包括有關樣式、指令碼和資料的的資訊，以幫助軟體（搜尋引擎、瀏覽器 等）使用和渲染頁面。 樣式和指令碼的元資料可以在頁面中定義，也可以連結到包含這些資訊的另一個檔案。

元素 描述
<base> 指定所有文件中相對 URL 所使用的基本 URL。 文件中只能有一個這樣的元素。
<head> 包含有關文件的機器可讀資訊（元資料），例如其 標題、指令碼 和 樣式表。
<link> 指定當前文件與外部資源之間的關係。 此元素最常用於連結到 CSS，但也用於建立網站圖示（包括“favicon”風格的圖示以及移動裝置上的主螢幕和應用程式的圖示）等。
<meta> 表示 元資料，這些元資料無法透過其他 HTML 元相關元素表示，例如 <base>、<link>、<script>、<style> 和 <title>。
<style> 包含文件或文件部分的樣式資訊。 它包含 CSS，應用於包含此元素的文件的內容。
<title> 定義文件的標題，該標題顯示在 瀏覽器 的標題欄或頁面的選項卡中。 它只包含文字；元素中的標籤將被忽略。

分節根

元素 描述
<body> 表示 HTML 文件的內容。 文件中只能有一個這樣的元素。

內容分節

內容分節元素允許您將文件內容組織成邏輯部分。 使用分節元素為您的頁面內容建立廣泛的提綱，包括頁首和頁尾導航，以及標題元素以標識內容部分。

元素 描述
<address> 表示所包含的 HTML 提供個人或組織的聯絡資訊。
<article> 表示文件、頁面、應用程式或站點中的獨立組合，旨在獨立分發或重用（例如，在聯合釋出中）。 例如，論壇帖子、雜誌或報紙文章、部落格條目、產品卡片、使用者提交的評論、互動式小部件或工具，或任何其他獨立的內容項。
<aside> 表示文件的一部分，其內容與文件的主要內容僅間接相關。 旁註通常以側邊欄或旁註框的形式呈現。
<footer> 表示其最近祖先 分節內容 或 分節根 元素的頁尾。 <footer> 通常包含有關部分作者的資訊、版權資料或指向相關文件的連結。
<header> 表示介紹性內容，通常是一組介紹性或導航輔助工具。 它可能包含一些標題元素，但也可能包含徽標、搜尋表單、作者姓名和其他元素。
<h1>、<h2>、<h3>、<h4>、<h5>、<h6> 表示六個級別的節標題。 <h1> 是最高節級別，<h6> 是最低節級別。
<hgroup> 表示與任何輔助內容（例如副標題、備用標題或標語）分組的標題。
<main> 表示文件主體的主要內容。 主要內容區域包含與文件的中心主題或應用程式的中心功能直接相關或擴充套件的內容。
<nav> 表示頁面的一個部分，其目的是提供導航連結，無論是當前文件內還是其他文件。 導航部分的常見示例包括選單、目錄和索引。
<section> 表示文件的通用獨立部分，沒有更具體的語義元素來表示它。 除極少數例外，部分應始終帶有標題。
<search> 表示包含一組表單控制元件或與執行搜尋或過濾操作相關的其他內容的部分。

文字內容

使用 HTML 文字內容元素來組織放置在起始 <body> 和結束 </body> 標籤之間的內容塊或內容部分。 這些元素對於 可訪問性 和 SEO 非常重要，它們識別該內容的用途或結構。

元素 描述
<blockquote> 表示所包含的文字是擴充套件的引用。 通常，這在視覺上透過縮排呈現。 引用來源的 URL 可以使用 cite 屬性給出，而來源的文字表示可以使用 <cite> 元素給出。
<dd> 提供描述列表 (<dl>) 中前一個術語 (<dt>) 的描述、定義或值。
<div> 流內容的通用容器。 它對內容或佈局沒有影響，直到使用 CSS 以某種方式進行樣式設定（例如，直接應用於它的樣式，或將某種佈局模型（如 flexbox）應用於其父元素）。
<dl> 表示描述列表。 此元素包含一組術語列表（使用 <dt> 元素指定）和描述（由 <dd> 元素提供）。 此元素的常見用途是實現詞彙表或顯示元資料（鍵值對列表）。
<dt> 指定描述或定義列表中的術語，因此必須在 <dl> 元素中使用。 它通常後跟 <dd> 元素；但是，一行中的多個 <dt> 元素表示多個術語，它們都由緊隨其後的 <dd> 元素定義。
<figcaption> 表示描述其父 <figure> 元素其餘內容的標題或圖例。
<figure> 表示自包含內容，可能包含可選的標題，該標題使用 <figcaption> 元素指定。 圖表、標題及其內容被引用為一個單元。
<hr> 表示段落級元素之間的主題斷裂：例如，故事中的場景變化，或部分內的主題轉換。
<li> 表示列表中的專案。 它必須包含在父元素中：有序列表 (<ol>)、無序列表 (<ul>) 或選單 (<menu>)。 在選單和無序列表中，列表項通常使用專案符號顯示。 在有序列表中，它們通常在左側顯示一個遞增的計數器，例如數字或字母。
<menu> 語義上是 <ul> 的替代方案，但瀏覽器（以及透過可訪問性樹公開）將其視為與 <ul> 沒有區別。 它表示專案的無序列表（由 <li> 元素表示）。
<ol> 表示專案的排序列表，通常呈現為編號列表。
<p> 表示段落。 段落通常在視覺媒體中表示為文字塊，與相鄰塊用空行和/或首行縮排分隔，但 HTML 段落可以是任何相關內容的結構分組，例如影像或表單欄位。
<pre> 表示預格式化的文字，該文字應按 HTML 檔案中的書寫方式呈現。 文字通常使用非比例或 等寬 字型呈現。 此元素內的空白將按書寫方式顯示。
<ul> 表示專案的無序列表，通常呈現為專案符號列表。

內聯文字語義

使用 HTML 內聯文字語義來定義單詞、行或任何任意文字片段的含義、結構或樣式。

元素 描述
<a> 與其 href 屬性一起，建立一個指向網頁、檔案、電子郵件地址、當前頁面內的位置或 URL 可以定址的任何其他內容的超連結。
<abbr> 表示縮寫或首字母縮略詞。
<b> 用於將讀者的注意力吸引到元素的內容，而這些內容沒有被賦予特殊的意義。 此前稱為粗體元素，大多數瀏覽器仍然以粗體形式繪製文字。 但是，您不應使用 <b> 對文字進行樣式設定或賦予重要性。 如果你想建立粗體文字，你應該使用 CSS font-weight 屬性。 如果你想表明一個元素特別重要，你應該使用強元素。
<bdi> 告訴瀏覽器的雙向演算法將它包含的文字與周圍文字隔離對待。 當網站動態插入一些文字並且不知道要插入的文字的方向時，它特別有用。
<bdo> 覆蓋文字的當前方向，以便其中的文字以不同的方向呈現。
<br> 在文字中產生換行符（回車符）。 它對於編寫詩歌或地址很有用，其中行分隔很重要。
<cite> 用於標記引用的創作作品的標題。 引用可以根據與引用元資料相關的上下文相關約定以縮寫形式呈現。
<code> 顯示其內容的樣式，旨在表明文字是計算機程式碼的簡短片段。 預設情況下，內容文字使用使用者代理的預設等寬字型顯示。
<data> 將給定的內容與機器可讀的翻譯連結起來。 如果內容與時間或日期相關，則必須使用 <time> 元素。
<dfn> 用於表示在定義短語或句子上下文中定義的術語。 <dfn> 元素的祖先 <p> 元素、<dt>/<dd> 對或 <dfn> 元素的最近部分祖先被認為是該術語的定義。
<em> 標記具有強調重點的文字。 <em> 元素可以巢狀，每個巢狀級別表示更高的強調程度。
<i> 表示從普通文字中分離的文字範圍，原因可能是習語文字、技術術語和分類學名稱等。 歷史上，這些都是使用斜體型別呈現的，這是此元素名稱 <i> 的最初來源。
<kbd> 表示表示來自鍵盤、語音輸入或任何其他文字輸入裝置的文字使用者輸入的內聯文字跨度。 按照慣例，使用者代理預設情況下使用其預設等寬字型渲染 <kbd> 元素的內容，儘管這未被 HTML 標準強制執行。
<mark> 表示因標記的段落在封閉上下文中相關而被標記或突出顯示以供參考或註釋的文字。
<q> 表示所包含的文字是簡短的內聯引用。 大多數現代瀏覽器透過用引號包圍文字來實現這一點。 此元素旨在用於不需要段落換行的簡短引用；對於長引用，請使用 <blockquote> 元素。
<rp> 用於為不支援使用 <ruby> 元素顯示紅寶石註釋的瀏覽器提供備用括號。 一個 <rp> 元素應包含包圍包含註釋文字的 <rt> 元素的開始和結束括號中的每一個。
<rt> 指定了 ruby 註釋的 ruby 文字元件，用於為東亞文字提供發音、翻譯或音譯資訊。<rt> 元素必須始終包含在 <ruby> 元素中。
<ruby> 表示渲染在基本文字上方、下方或旁邊的較小的註釋，通常用於顯示東亞字元的發音。它也可以用於註釋其他型別的文字，但這種用法不太常見。
<s> 使用刪除線或穿過文字的線渲染文字。使用 <s> 元素來表示不再相關或不再準確的事物。但是，<s> 不適合指示文件編輯；為此，請根據情況使用 <del> 和 <ins> 元素。
<samp> 用於封裝表示計算機程式示例（或引用）輸出的內聯文字。其內容通常使用瀏覽器的預設等寬字型（例如 Courier 或 Lucida Console）渲染。
<small> 表示旁註和小字，如版權和法律文字，獨立於其樣式呈現。預設情況下，它將其內部的文字渲染為小一號字型，例如從 small 到 x-small。
<span> 用於對短語內容進行通用內聯容器，本身不代表任何東西。它可以用於將元素分組以進行樣式設定（使用 class 或 id 屬性），或者因為它們共享屬性值，例如 lang。它應該只在沒有其他語義元素適用時使用。<span> 與 div 元素非常相似，但 div 是一個 塊級元素，而 <span> 是一個 內聯級元素。
<strong> 指示其內容具有很強的重要性、嚴肅性或緊迫性。瀏覽器通常以粗體形式渲染內容。
<sub> 指定應以下標形式顯示的內聯文字，僅出於排版原因。下標通常使用較小的文字以降低的基線渲染。
<sup> 指定應以上標形式顯示的內聯文字，僅出於排版原因。上標通常使用較小的文字以升高的基線渲染。
<time> 表示特定時間段。它可能包含 datetime 屬性，將日期轉換為機器可讀格式，從而實現更好的搜尋引擎結果或自定義功能，例如提醒。
<u> 表示應以指示其具有非文字註釋的方式渲染的內聯文字範圍。預設情況下，這將呈現為簡單的實心下劃線，但可以使用 CSS 進行更改。
<var> 表示數學表示式或程式設計環境中的變數名稱。它通常使用當前字型的斜體版本呈現，儘管此行為取決於瀏覽器。
<wbr> 表示單詞斷行機會——文字中瀏覽器可以選擇斷行的位置，儘管它的斷行規則不會在該位置建立斷行。

影像和多媒體

HTML 支援各種多媒體資源，例如影像、音訊和影片。

元素 描述
<area> 在影像地圖內定義一個區域，該區域具有預定義的可點選區域。影像地圖允許將影像上的幾何區域與 超連結 相關聯。
<audio> 用於在文件中嵌入聲音內容。它可能包含一個或多個音訊源，使用 src 屬性或 source 元素表示：瀏覽器將選擇最合適的源。它也可以是流媒體的目的地，使用 MediaStream。
<img> 將影像嵌入文件中。
<map> 與 <area> 元素一起使用來定義影像地圖（可點選連結區域）。
<track> 用作媒體元素 audio 和 video 的子元素。它允許您指定定時文字軌道（或基於時間的​​資料），例如自動處理字幕。軌道採用 WebVTT 格式（.vtt 檔案）——Web 影片文字軌道。
<video> 在文件中嵌入支援影片播放的媒體播放器。您也可以將 <video> 用於音訊內容，但 audio 元素可能提供更合適的使用者體驗。

嵌入內容

除了常規多媒體內容外，HTML 還包含各種其他內容，即使它並不總是容易互動的。

元素 描述
<embed> 在文件中指定點嵌入外部內容。此內容由外部應用程式或其他互動式內容來源（如瀏覽器外掛）提供。
<fencedframe> 表示巢狀的瀏覽上下文，如 <iframe>，但內建了更多本機隱私功能。
<iframe> 表示巢狀的瀏覽上下文，將另一個 HTML 頁面嵌入當前頁面中。
<object> 表示外部資源，可以將其視為影像、巢狀瀏覽上下文或由外掛處理的資源。
<picture> 包含零個或多個 <source> 元素和一個 <img> 元素，以針對不同的顯示/裝置場景提供影像的替代版本。
<portal> 允許將另一個 HTML 頁面嵌入當前頁面中，以實現更順暢的新頁面導航。
<source> 為圖片、音訊元素或影片元素指定多個媒體資源。它是一個空元素，這意味著它沒有內容並且沒有結束標籤。它通常用於以多種檔案格式提供相同的媒體內容，以提供與各種瀏覽器的相容性，因為它們對 影像檔案格式 和 媒體檔案格式 的支援不同。

SVG 和 MathML

您可以使用 SVG 和 MathML 元素將 SVG 和 MathML 內容直接嵌入 HTML 文件中，使用 <svg> 和 <math> 元素。

元素 描述
<svg> 定義新座標系和 視窗 的容器。它用作 SVG 文件的最外層元素，但也可以用於將 SVG 片段嵌入 SVG 或 HTML 文件中。
<math> MathML 中的頂級元素。每個有效的 MathML 例項都必須包含在其中。此外，您不能將第二個 <math> 元素巢狀在另一個元素中，但您可以在其中包含任意數量的其他子元素。

指令碼

為了建立動態內容和 Web 應用程式，HTML 支援使用指令碼語言，最突出的是 JavaScript。某些元素支援此功能。

元素 描述
<canvas> 容器元素，與 canvas 指令碼 API 或 WebGL API 一起使用，以繪製圖形和動畫。
<noscript> 定義要插入 HTML 部分的，如果頁面上的指令碼型別不受支援或瀏覽器當前關閉了指令碼。
<script> 用於嵌入可執行程式碼或資料；這通常用於嵌入或引用 JavaScript 程式碼。<script> 元素也可以與其他語言一起使用，例如 WebGL 的 GLSL 著色器程式語言和 JSON。

標記編輯

這些元素允許您提供指示，表明文字的特定部分已被更改。

元素 描述
<del> 表示已從文件中刪除的文字範圍。例如，這可以在渲染“跟蹤更改”或原始碼 diff 資訊時使用。<ins> 元素可以用於相反的目的：指示已新增到文件的文字。
<ins> 表示已新增到文件的文字範圍。您可以使用 <del> 元素類似地表示已從文件中刪除的文字範圍。

表格內容

這裡的元素用於建立和處理表格資料。

元素 描述
<caption> 指定表格的標題（或標題）。
<col> 在由其隱式或顯式父 <colgroup> 元素表示的列組中定義一個或多個列。<col> 元素僅在作為 <colgroup> 元素的子元素時有效，該元素沒有定義 span 屬性。
<colgroup> 在表格中定義一組列。
<table> 表示表格資料——即以二維表格形式呈現的資訊，由包含資料的行和列的單元格組成。
<tbody> 封裝一組表格行 (<tr> 元素)，指示它們構成表格主體（主要）資料。
<td> 是 <tr> 元素的子元素，它定義表格的一個包含資料的單元格。
<tfoot> 封裝一組表格行 (<tr> 元素)，指示它們構成表格腳註，包含有關表格列的資訊。這通常是列的摘要，例如，列中給定數字的總和。
<th> 是 <tr> 元素的子元素，它定義單元格作為一組表格單元格的標題。該組的性質可以透過 scope 和 headers 屬性明確定義。
<thead> 封裝一組表格行 (<tr> 元素)，指示它們構成表格表頭，包含有關表格列的資訊。這通常以列標題 (<th> 元素) 的形式呈現。
<tr> 定義表格中的一行單元格。然後可以使用 <td>（資料單元格）和 <th>（標題單元格）元素的組合來建立行的單元格。

表單

HTML 提供了幾個元素，這些元素可以一起使用來建立使用者可以填寫並提交到網站或應用程式的表單。有關此的更多資訊，請參閱 HTML 表單指南。

元素 描述
<button> 一個互動式元素，由使用者使用滑鼠、鍵盤、手指、語音命令或其他輔助技術啟用。啟用後，它會執行操作，例如提交 表單 或開啟對話方塊。
<datalist> 包含一組 <option> 元素，這些元素表示在其他控制元件中可供選擇的允許或建議的選項。
<fieldset> 用於將多個控制元件以及標籤 (<label>) 分組在 Web 表單中。
<form> 表示一個文件部分，其中包含用於提交資訊的互動式控制元件。
<input> 用於建立用於基於 Web 的表單的互動式控制元件，以從使用者那裡接受資料；根據裝置和使用者代理，可以使用多種型別的輸入資料和控制元件小部件。<input> 元素是所有 HTML 中最強大和最複雜的元素之一，因為輸入型別和屬性的組合數量眾多。
<label> 表示使用者介面中專案的標題。
<legend> 表示其父 <fieldset> 內容的標題。
<meter> 表示已知範圍內的標量值或分數值。
<optgroup> 在 <select> 元素中建立一組選項。
<option> 用於定義 select、<optgroup> 或 <datalist> 元素中包含的專案。因此，<option> 可以表示 HTML 文件中彈出視窗中的選單項和其他專案列表。
<output> 容器元素，網站或應用程式可以將計算結果或使用者操作的結果注入其中。
<progress> 顯示一個指示器，顯示任務的完成進度，通常顯示為進度條。
<select> 表示一個提供選項選單的控制元件。
<textarea> 表示一個多行純文字編輯控制元件，當你想要允許使用者輸入大量的自由格式文字時很有用，例如，對評論或反饋表單的評論。

互動式元素

HTML 提供了一系列元素，有助於建立互動式使用者介面物件。

元素 描述
<details> 建立一個顯示小部件，其中資訊僅在小部件切換到“開啟”狀態時可見。必須使用 <summary> 元素提供摘要或標籤。
<dialog> 表示一個對話方塊或其他互動式元件，例如可關閉的警報、檢查器或子視窗。
<summary> 為 details 元素的顯示框指定摘要、標題或圖例。單擊 <summary> 元素將切換父 <details> 元素的開啟和關閉狀態。

Web 元件

Web Components 是一種與 HTML 相關的技術，它使得建立和使用自定義元素成為可能，就好像它是普通的 HTML 一樣。此外，你可以建立標準 HTML 元素的自定義版本。

元素 描述
<slot> 作為 Web Components 技術套件的一部分，該元素是 Web 元件內的佔位符，你可以用自己的標記填充它，這使你可以建立獨立的 DOM 樹並將它們組合在一起。
<template> 一種用於儲存 HTML 的機制，這些 HTML 在頁面載入時不會立即呈現，但可以在執行時使用 JavaScript 例項化。

已過時和已棄用的元素

警告：這些是已棄用的舊 HTML 元素，不應該使用。你絕不應該在新的專案中使用它們，並且應該儘快在舊專案中替換它們。它們僅出於完整性考慮在此處列出。

元素 描述
<acronym> 允許作者明確指示構成單詞的首字母縮略詞或縮寫的字元序列。
<big> 以比周圍文字大一級別的字型大小呈現封閉的文字（例如，medium 變成 large）。大小上限為瀏覽器允許的最大字型大小。
<center> 在其包含元素內水平居中顯示其塊級或內聯內容。
<content> 一個已過時的 Web Components 技術套件的一部分 - 在 Shadow DOM 內用作插入點，不打算在普通 HTML 中使用。現在它已被 <slot> 元素取代，該元素在 DOM 中建立了一個可以插入 Shadow DOM 的點。考慮使用 <slot> 而不是它。
<dir> 用於儲存檔案和/或資料夾的目錄，可能應用了使用者代理應用的樣式和圖示。不要使用這個已過時的元素；相反，你應該使用 <ul> 元素來表示列表，包括檔案列表。
<font> 為其內容定義字型大小、顏色和字形。
<frame> 定義一個特定區域，可以在其中顯示另一個 HTML 文件。框架應該在 <frameset> 中使用。
<frameset> 用於包含 <frame> 元素。
<image> 一個古老且支援不佳的 <img> 元素的前身。它不應該被使用。
<marquee> 用於插入一個滾動文字區域。你可以使用它的屬性來控制文字到達其內容區域邊緣時會發生什麼。
<menuitem> 表示使用者可以透過彈出選單呼叫的命令。這包括上下文選單，以及可能附加到選單按鈕的選單。
<nobr> 防止其包含的文字自動換行，可能導致使用者必須水平滾動才能看到文字的整個寬度。
<noembed> 一個已過時的、非標準的方式來為不支援 embed 元素或不支援作者希望使用的 嵌入內容 型別的瀏覽器提供替代或“回退”內容。該元素在 HTML 4.01 及更高版本中被棄用，取而代之的是將回退內容放置在 <object> 元素的開始和結束標籤之間。
<noframes> 提供要向不支援（或停用了對）<frame> 元素的瀏覽器呈現的內容。雖然大多數常用的瀏覽器都支援框架，但也有一些例外，包括某些特殊用途的瀏覽器，包括一些移動瀏覽器，以及文字模式瀏覽器。
<param> 為 <object> 元素定義引數。
<plaintext> 將開始標籤之後的任何內容呈現為原始文字，忽略任何後續的 HTML。沒有結束標籤，因為之後的所有內容都被視為原始文字。
<rb> 用於分隔 ruby 註釋的基本文字元件，即正在註釋的文字。一個 <rb> 元素應該包含基本文字的每個單獨的原子段。
<rtc> 包含在 <ruby> 元素內部使用的 <rb> 元素的 ruby 中呈現的字元的語義註釋。 <rb> 元素可以同時具有發音 (<rt>) 和語義 (<rtc>) 註釋。
<shadow> Web Components 技術套件中一個已過時的部分，旨在用作 Shadow DOM 插入點。如果你在 Shadow 主機下建立了多個 Shadow 根，你可能已經使用過它。考慮使用 <slot> 而不是它。
<strike> 在文字上放置刪除線（水平線）。
<tt> 建立使用使用者代理預設等寬字型字形的內聯文字。此元素是為呈現文字的目的而建立的，就像它在固定寬度顯示器（如電傳打字機、純文字螢幕或行式印表機）上顯示一樣。
<xmp> 使用等寬字型呈現開始和結束標籤之間的文字，而不解釋之間的 HTML。HTML2 規範建議它應該呈現得足夠寬，以允許每行 80 個字元。

另請參閱