HTML - 標籤參考

包含每個標籤程式碼示例的 HTML 標籤，例如表格、表單、錨點、影像、標題、跑馬燈、文字區域、段落、標題、引用、格式化、div、程式碼等。

什麼是 HTML 標籤？

HTML 標籤類似於關鍵詞，它們指定 Web 瀏覽器如何格式化和顯示內容。Web 瀏覽器可以使用標籤區分簡單內容和 HTML 內容。HTML 標籤的重要組成部分是起始標籤和結束標籤。但是，HTML 中有些標籤不需要閉合。

它們為什麼重要？

Web 瀏覽器從左到右，從上到下檢視 HTML 文件。要生成 HTML 文件並呈現其結構，請使用 HTML 標籤。每個 HTML 標籤都具有一組獨特的特性。

帶示例的 HTML 標籤列表

我們根據用途對標籤進行了分類，以建立任何特定元件。

基本標籤
格式化標籤
表單和輸入標籤
影像標籤
音訊和影片標籤
連結標籤

列表標籤
表格標籤
樣式和語義標籤
元標籤
程式設計標籤

除非我們強制單獨使用，否則每個標籤都與其他一些標籤一起使用。每個標籤在表格的第三列都有其自己的示例程式碼，您可以檢視和編輯以檢視結果。

HTML 基本標籤

HTML 基本標籤是 HTML 的基本元素，用於定義文件的結構。這些是由尖括號（< 和 >）括起來的字母或單詞。通常，大多數 HTML 標籤都包含起始標籤和結束標籤。每個標籤都有不同的含義，瀏覽器讀取標籤並相應地顯示其中包含的內容。

以下是列出的基本標籤

標籤	描述	示例
<!--...-->	指定註釋。註釋是程式碼中的批註，不會顯示在瀏覽器視窗中。	試試看
<!DOCTYPE>	指定文件型別。這是指定文件型別和 HTML 版本所需的初始宣告。	試試看
<html>	html 標籤是包含所有其他 HTML 標籤的容器。它包含圍繞標籤名稱的起始和結束尖括號。	試試看
<head>	指定有關文件的資訊。Html <head> 標籤指定為元資料容器。	試試看
<title>	指定文件標題。<title> 放在 <head> 中，指定在開啟網頁時顯示在瀏覽器標題欄或選項卡中的簡潔明瞭的標籤。	試試看
<body>	指定 body 元素。HTML <body> 標籤用作網頁中所有可見內容的容器。	試試看
<h1> 到 <h6>	指定標題 1 到標題 6。它表示部分或整個頁面的主要標題或標題。	試試看
<p>	指定一個段落。此標籤用作文字塊和指定網頁內容的容器。	試試看
<br>	插入單行換行符。它是一個自閉合元素，用於在文字內容中建立強制換行。	試試看
<hr />	指定水平規則。它是一個自閉合元素，用於在網頁內容中插入主題中斷或分隔符。	試試看

HTML 格式化標籤

格式化 HTML 中的標籤是用於組織和設定網頁內容樣式的元素，可以增強其外觀和可讀性。這些標籤為文字部分新增語義值，並用於設定文字的視覺外觀。

以下是列出的格式化標籤

標籤	描述	示例
<abbr>	指定縮寫。它提供了一種語義化和易於訪問的方式來識別和解釋其含義。	試試看
<address>	指定地址元素。<address> 標籤提供了一種語義化方式來組織文件中的聯絡資訊或作者詳細資訊。	試試看
<bdi>	表示必須將其與周圍環境隔離以進行雙向文字格式化的文字。它允許嵌入具有不同或未知方向性的文字跨度。	試試看
<bdo>	指定文字顯示方向。它是一個標記元素，用於指定文件中文字的方向。	試試看
<blockquote>	指定長引用。它是一個結構化元素，用於識別和視覺上分離網頁中的引用內容。	試試看
<cite>	指定引用。它是一個語義元素，用於標記在文件中引用的創意作品（例如書籍、文章、歌曲或電影）的標題。	試試看
<code>	指定計算機程式碼文字。HTML <code> 標籤是一個語義元素，用於標記表示文件中計算機程式碼的文字部分。	試試看
<del>	指定已刪除的文字。它是一個語義元素，用於標記已從文件中刪除或移除的文字。	試試看
<dfn>	指定定義術語。它通常與 <dl> 元素一起使用，以及 <dt> 和 <dd> 標籤。	試試看
<em>	指定強調文字。HTML 中的 <em> 標籤用於強調文字，通常透過斜體顯示。	試試看
<i>	指定斜體文字。HTML 中的 <i> 標籤用於將斜體格式應用於文字，主要用於演示目的。	試試看
<ins>	指定插入的文字。HTML 中的 <ins> 標籤用於標記已插入到文件中的文字。	試試看
<kbd>	指定鍵盤文字。HTML 中的 <kbd> 標籤用於指示表示使用者輸入或鍵盤輸入的文字。	試試看
<mark>	指定為了參考目的而突出顯示的文字，即為了其在其他上下文中的相關性。	試試看
<meter>	HTML 中的 <meter> 標籤用於表示預定義範圍內的測量值。	試試看
<pre>	HTML 中的 <pre> 標籤用於定義預格式化文字，該文字將完全按照 HTML 程式碼中顯示的樣子顯示。	試試看
<progress>	HTML 中的 <progress> 標籤用於表示任務的進度或操作的完成狀態。	試試看
<q>	HTML 中的 <q> 標籤用於指示段落或文字中的簡短內聯引用。	試試看
<rp>	指定顯示給不支援 ruby 元素的瀏覽器。	試試看
<rt>	HTML 中的 <rt> 標籤用於定義 ruby 註解的文字元件。	試試看
<ruby>	指定 ruby 註解。此標籤通常與 <rt> 和 <rp> 標籤一起使用。	試試看
<s>	它用於以刪除線呈現文字。<s> 標籤指定不再正確、準確或相關的文字。	試試看
<samp>	它用於包含表示來自計算機程式或指令碼的示例輸出的內聯文字。	試試看
<small>	HTML 中的 <small> 標籤用於指示文件中較小的文字。	試試看
<strong>	HTML 中的 <strong> 標籤用於指示文件中較小的文字。	試試看
<sub>	HTML 中的 <sub> 標籤用於定義文件中的下標文字。	試試看
<sup>	HTML 中的 <sup> 標籤用於定義文件中的上標文字。	試試看
<template>	這是一種機制，用於在頁面載入時隱藏使用者看不到的某些客戶端內容。	試試看
<time>	HTML 中的 <time> 標籤用於表示文件中的特定時間或日期。	試試看
<var>	HTML 中的 <var> 標籤表示數學表示式或程式設計上下文中的變數名稱。	試試看
<wbr>	指示 <nobr> 部分中可能的單詞換行點。	試試看
<b>	它用於突出顯示文字並指定粗體文字。	試試看

HTML 表單和輸入標籤

表單在網頁中起著至關重要的作用，通常用於收集聯絡資訊、進行調查和啟用使用者評論。

以下是列出的表單和輸入標籤：

標籤	描述	示例
<form>	在文件中指定表單，通常用於收集聯絡資訊、進行調查和啟用使用者評論。	試試看
<input>	<input> 標籤用於在文件中指定輸入欄位，並用於在基於 Web 的表單中建立互動式控制元件。	試試看
<textarea>	<textarea> 標籤用於在文件中指定文字區域或 HTML 表單中的多行文字輸入控制元件。	試試看
<button>	HTML <button> 標籤用於在 HTML 表單中插入按鈕元素。	試試看
<select>	<select> 標籤用於 HTML 表單中，並提供使用者可以選擇的一系列選項。	試試看
<optgroup>	HTML 中的 <optgroup> 標籤用於在一個 <select> 元素（表示下拉列表）中對相關的選項進行分組。	試試看
<option>	<option> 標籤用於透過在下拉列表中建立可選選項來在 HTML <select> 標籤中指定選項。	試試看
<label>	為表單控制元件指定標籤，並用作使用者介面中專案的標題。	試試看
<fieldset>	HTML <fieldset> 標籤用於將表單控制元件（例如輸入欄位、複選框和單選按鈕）組合在一起。	試試看
<legend>	HTML <legend> 標籤用於在 HTML <fieldset> 標籤中指定標題。	試試看
<datalist>	HTML 中的 <datalist> 標籤為 <input> 元素指定預定義選項列表。	試試看
<output>	<output> 標籤用於在 HTML 表單標籤中指定計算結果。	試試看

HTML 圖片標籤

圖片是網頁的重要元素，使網頁更具表現力，並增加了與內容的相關性。

以下是列出的圖片標籤：

標籤	描述	示例
<img>	<img> 標籤用於在 HTML 文件中指定圖片。	試試看
<map>	HTML 中的 <map> 標籤用於定義影像地圖，並透過將影像劃分為多個可點選區域來建立視覺上吸引人的介面。	試試看
<area>	HTML 中的 <area> 標籤用於 <map> 元素中，以定義影像地圖中可點選的區域。	試試看
<canvas>	HTML 中的 <canvas> 標籤用於定義網頁上的一個區域，可以使用 JavaScript 在該區域動態呈現圖形、動畫或視覺元素。	試試看
<figcaption>	HTML 中的 <figcaption> 標籤用於為 <figure> 元素提供標題或描述，並允許開發人員為影像、插圖、圖表、影片或其他多媒體內容新增描述性文字。	試試看
<figure>	<figure> 標籤指定自包含的內容，例如 HTML 文件中的影像、插圖、圖表。	試試看
<picture>	<picture> 允許指定多張影像，這些影像旨在更準確地填充瀏覽器視口。	試試看
<svg>	HTML 中的 <svg> 標籤用於將可縮放向量圖形 (SVG) 直接附加到網頁中。它是一種用於描述視覺效果的模組化語言。	試試看

HTML 音訊和影片標籤

HTML <audio> 和 <video> 標籤在網頁上新增視覺上吸引人和資訊豐富的內容。這些標籤有助於增強使用者體驗。

以下是列出的音訊/影片標籤：

標籤	描述	示例
<audio>	<audio> 標籤用於在 HTML 文件中插入聲音內容，例如音樂或其他音訊流。	試試看
<source>	指定媒體元素的媒體資源，在影片或音訊元素內定義。	試試看
<track>	<track> 標籤用於為多媒體元素（例如 <audio> 和 <video> 標籤）指定文字軌道。	試試看
<video>	HTML <video> 標籤用於在 HTML 文件中插入影片內容，例如電影剪輯或其他影片流。指定媒體播放器中使用的文字軌道。	試試看

HTML 連結標籤

HTML 連結是超連結，這意味著當您單擊連結時，它會跳轉到另一個文件。網頁可以包含各種連結，這些連結可以直接帶我們到其他網頁或資源，甚至是給定頁面的特定部分。

以下是列出的連結標籤：

標籤	描述	示例
<a>	指定錨點。HTML <a> 標籤在 HTML 文件中建立超連結。	試試看
<link>	HTML <link> 標籤用於在 HTML 文件中連結外部資源。	試試看
<nav>	HTML <nav> 標籤用於指定僅包含導航連結的部分。	試試看

HTML 列表是用於以各種方式組織和構造網頁內容的基本元素。

以下是列出的列表標籤：

標籤	描述	示例
<ul>	HTML <ul> 標籤在 HTML 文件中指定無序列表。它用於對專案集合進行分組，而無需任何特定的數字順序。	試試看
<ol>	HTML <ol> 標籤在 HTML 文件中指定有序列表。它用於按特定數字順序對專案集合進行分組。	試試看
<li>	HTML <li> 用於在 HTML 文件中指定列表項。它在建立有序列表和無序列表中都起著重要作用。	試試看
<dl>	HTML <dt> 標籤用於在 HTML 文件中指定定義列表，並提供組織它們的方法。	試試看
<dt>	<dt> 標籤用於在描述或定義列表中指定術語。	試試看
<dd>	HTML <dd> 標籤在指定描述列表中的定義描述方面起著至關重要的作用。	試試看

HTML 表格標籤

表格在 HTML 中通常用於以行和列的形式組織和呈現詳細資料。它們允許使用者快速掃描和理解資訊。

以下是列出的表格標籤：

標籤	描述	示例
<table>	以有組織且易於呈現的方式在 HTML 文件中指定表格。	試試看
<caption>	在 HTML 文件中指定表格標題。	試試看
<th>	在 HTML <table> 標籤中指定表格標題。	試試看
<tr>	在 HTML <table> 中指定表格行。	試試看
<td>	在 HTML <table> 中指定表格單元格。	試試看
<thead>	在 HTML <table> 中指定表格標題，並用於在 HTML 表格中分組標題內容。	試試看
<tbody>	在 HTML <table> 中指定表格主體。	試試看
<tfoot>	在 HTML 表格中指定表格頁尾，並用於在 HTML 表格中分組頁尾內容。	試試看
<col>	指定表格列的屬性。<col> 元素允許您將樣式應用於整個列。	試試看
<colgroup>	指定表格列組。<colgroup> 標籤必須作為 <table> 元素的子元素出現。	試試看

HTML 樣式和語義標籤

HTML 包含樣式和語義標籤列表。HTML 樣式標籤透過在 HTML 文件中新增樣式來增強其外觀。HTML 語義標籤透過定義其包含的內容的含義來嵌入簡單性。

以下是列出的樣式和語義標籤：

標籤	描述	示例
<style>	HTML <style> 標籤定義 CSS（層疊樣式表）用於文件樣式。這些標籤用於定義網頁中元素的顯示樣式。	試試看
<div>	HTML <div> 標籤是構建網頁的基本構建塊，用於定義 HTML 文件中的分段或部分。	試試看
<span>	HTML <span> 標籤是用於內聯元素和內容的內聯容器，用於標記文字的一部分或文件中的一個部分。	試試看
<header>	為文件或部分指定標題。它是一個語義元素，包含網頁中的介紹性內容和導航元素。	試試看
<footer>	為文件或部分指定頁尾。它是一個語義元素，用於定義網頁的頁尾部分。	試試看
<main>	指定文件中的主要或重要內容。文件中只有一個 <main> 元素。	試試看
<section>	指定文件中的一個部分。HTML <section> 標籤在文件中新增組織良好的部分。	試試看
<article>	在 HTML 文件中指定文章。它是一個語義元素，用於定義自包含的內容片段。	試試看
<aside>	指定與頁面內容鬆散相關的內容。如果將其刪除，其餘內容仍然有意義。	試試看
<details>	它用於建立一個顯示小部件，其中包含一些資訊，當小部件切換到“開啟”狀態時可見。	試試看
<dialog>	在 HTML 文件中指定對話方塊或視窗。	試試看
<summary>	為給定的 <details> 指定摘要、標題或圖例。	試試看
<data>	HTML data 標籤用於將給定的內容片段與機器可讀的翻譯連結起來。	試試看

HTML 元標籤

HTML 元標籤用於在網頁中提供結構化資訊，其內容不會顯示在網頁上。

以下是列出的元資訊標籤：

標籤	描述	示例
<meta>	指定 HTML 文件的元資料，這些元資料不會顯示在頁面上。	試試看
<base>	為頁面中的所有連結指定基本 URL。<base> 標籤通常放在 HTML 文件的 <head> 部分內。	試試看

HTML 程式設計標籤

HTML 程式設計標籤是 HTML 文件的構建塊，用於在文件中定義不同型別的內容。

以下是列出的程式設計標籤：

標籤	描述	示例
<script>	在 HTML 文件中指定指令碼，並用於嵌入客戶端指令碼語言。	試試看
<noscript>	在 HTML 文件中指定 noscript 部分。	試試看
<embed>	指定外部（非 HTML）應用程式的容器。	試試看
<object>	在 HTML 文件中指定嵌入物件。	試試看

列印頁面