資料結構
網路
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.tw/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.tw/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+ 次瀏覽
