数据结构
网络
RDBMS
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装设计
法律研究HTML 中的容器标签和空标签
HTML 使用预定义的标签来指示浏览器如何显示内容。标签只不过是一些包含在尖括号（即 <>）中的指令。虽然标签在整个网站中使用，但许多访问者经常不清楚给定标签是容器标签还是空标签。他们感到困惑，因为他们不确定哪些标签除了开始标签之外还需要结束标签。在 HTML 中，标签分为两类：
空标签
容器标签
现在，让我们深入了解文章，以便更好地理解 HTML 中的容器标签和空标签。让我们逐一讨论
HTML 容器标签
容器标签通常具有三个组成部分：开始标签、内容（浏览器将显示的内容）和结束标签。它们还可能在内容部分包含一些额外的标签。这些开始和结束标签，也称为 ON 和 OFF 标签，成对使用，分别称为开始标签和结束标签。如果您忽略关闭容器标签，浏览器将一直使用开始标签的效果，直到页面结束。因此，在使用容器标签时要小心。容器标签构成了 HTML 中大部分标签。
语法
以下是 HTML 容器标签的语法
<tagname>….</tagname>
常用标签
让我们看看 HTML 中常用的容器标签
基本标签
这些标签用于形成网页的结构。
<html>…</html> - 这表示网页的开始和结束，并指示它是一个 HTML 文档。它包含所有用于创建网页的其他标签，这些标签位于这些标签之间。
<head>..</head> - 此标签用于指定文档的头部部分，其中包含与网页相关的数据。
<title>..</title> - 此标签存储网页的描述；在浏览器打开选项卡时，这些标签中提供的任何信息都会显示在选项卡名称上。它在头部标签中描述。
<body>..</body> - 此标签用于向查看者显示网页上的所有信息或数据，包括文本、图像、超链接、视频等。
标题
这些标签用于在网页中创建标题。
<h1>…</h1> 到 <h6>…</h6> - 此标签用于包含不同大小的标题，范围从 1 到 6。
文本格式化
这些标签用于网页中的文本格式化。
<p>….</p> - 此标签用于根据用户需求包含段落。
<b>….</b> - 此标签用于使包含的文本变为粗体。
<i>…</i> - 此标签用于使包含的文本变为斜体。
超链接
此标签用于在网页中定义超链接
<a href="link">…</a> - <a...>...</a>标签用于在链接到其他网页时向其他网页添加超链接。
按钮标签
此标签用于在网页上创建可点击的按钮。
<button>…</button> - 其主要应用是操作，通过添加事件和许多其他方法来实现。
分隔标签
此标签用于在网页中创建分隔。
<div>…</div> - 它描述了文档中的一个部分。使用 <div>...</div> 标签，可以将网页分成不同的部分。
脚本标签
此标签用于向网页添加 JavaScript。
<script>..</script> - 指定 JavaScript 代码，该代码对网页具有交互性。
列表
此标签用于以有序列表或无序列表的形式格式化数据。
<ol>…</ol> - 用于创建有序列表。
<ul>…</ul> - 用于创建无序列表。
<li>…</li> - 用于添加列表项。
示例
以下是示例，我们将在此示例中在网页中使用容器标签。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Containe Tags</title>
</head>
<body>
<h1>H1 Heading</h1>
<h2>H2 Heading</h2>
<h3>H3 Heading</h3>
<h4>H4 Heading</h4>
<h5>H5 Heading</h5>
<h6>H6 Heading</h6>
<p>Add the text of yor wish. which looks like a paragraph.</p>
<h4> Link </h4>
<a href="https://tutorialspoint.com/index.htm">TutorialsPoint</a>
<ol>
<li>ListItem1</li>
<li>ListItem2</li>
<li>ListItem3</li>
<li>ListItem4</li>
</ol>
</body>
</html>
当我们执行上述代码时，输出窗口将弹出，显示网页上标签之间包含的所有内容。
HTML 空标签
空标签是指没有结束标签的标签。尽管空标签只有开始标签，但它会在网页上执行某些操作。
语法
以下是 HTML 空标签的语法
<tagname>
现在，让我们看看 HTML 中一些经常使用的空标签。
<br> - 它用于在用户希望的任何位置插入网页中的换行符。
<hr> - 它用于在网页中需要的位置插入水平线。
<img> - 此标签用于显示网站上标签的 src 属性中指定的图像。
<input> - 它主要与表单一起使用以收集用户输入，我们也可以指定输入类型。
<link> - 当我们将 CSS 存储在外部文件中时，它主要用于链接 CSS 文件，因为它可以用于将其他外部文件和文档链接到网页。
<meta> - 包含网页的所有元数据。头部标签描述元数据，即关于数据的数据。
<source> - 当需要在网页上包含外部媒体源时。可以使用 source 标签将任何媒体源（包括音频、视频等）添加到我们的网站。
示例
考虑以下示例，我们将在此示例中在网页中使用空标签。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<hr>
<p>Welcome To The TutorialsPoint</p>
<hr>
<p>Line <br>Break </p>
<img src="https://tutorialspoint.com/images/logo.png?v2" alt="Logo" width="150" height="20">
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<br>
<br>
</form>
<video width="320" height="240" controls>
<source src="https://player.vimeo.com/external/415068616.hd.mp4?s=e6dc106b7cccb956aa1d00d705e440977290df18&profile_id=174&oauth2_token_id=57447761.mp4" type="video/mp4">
</video>
</body>
</html>
运行上述代码后，输出窗口将弹出，显示我们在网页中使用的所有空标签内容。
1K+ 次浏览
