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 文档中指定嵌入对象。	试试看

打印页面