HTML中id和class的區別
- WBOY轉載
- 2023-08-31 11:53:061798瀏覽
在 HTML 中，Id 和 Class 都是元素選擇器，用於根據指派給這些參數的名稱來識別元素。 ID 和類別選擇器是 CSS (HTML) 中使用最廣泛的元素選擇器。 ID 和 Class 之間的基本差異在於 ID 選擇器僅套用於頁面中的一個元素，而類別選擇器可以套用於單一頁面上的多個元素。
閱讀本文，詳細了解 HTML 中的「id」和「class」以及它們之間的差異。
HTML 中的 ID 是什麼？
在 HTML 中，「id」選擇器用於元素的 id 屬性。對於 HTML 元素，「id」名稱以符號「#」開頭，後面跟著唯一名稱。 id 元素的一個重要特性是我們只能將一個 id 選擇器附加到一個元素。因此，ID 選擇器在 HTML 頁面中始終是唯一的。
ID 選擇器範例
<!DOCTYPE html>
<html>
<head>
<title>
Id demo
</title>
<style>
#idDemo{
color:green;
font-size:25px;
}
</style>
</head>
<body style="text-align:center">
<h1>Get element by Id</h1>
<p id="idDemo">Demo for Id selector</p>
</body>
</html>
HTML 中的 CLASS 是什麼？
在 HTML 中，「類別」選擇器用於選擇具有特定類別屬性的元素。類別選擇器以句點 (.) 開頭，後面跟著類別名稱。與 id 選擇器不同，我們可以將多個選擇器附加到 HTML 元素。因此，該類別可以在一個頁面內多次套用。關於類別選擇器需要注意的重要一點是類別名稱不能以數字開頭。
類別選擇器範例
<!DOCTYPE html>
<html>
<head>
<title>
Class demo
</title>
<style>
.classDemo{
color:orange;
font-size:25px;
}
</style>
</head>
<body style="text-align:center">
<h1>Get element by class<h1>
<p class="classDemo">Demo for class selector</p>
</body>
</html>
HTML 中 ID 與 CLASS 的差異
以下是Id和Class &minius之間的重要區別；
鍵 |
Id |
類別 |
|---|---|---|
文法 |
在 HTML 中，對於元素，ID 名稱以「#」符號開頭，後面跟著分配給它的唯一名稱。 |
指派給元素的「class」的名稱以「.」開頭。後面是類別名稱。 |
選擇器 |
一個元素只能附加一個 ID 選擇器。 |
可以將多個類別選擇器附加到一個元素。 |
唯一性愛 |
ID在頁面中是唯一的，最多只能套用於一個元素 |
#該類別可以應用於多個元素，因此可以在單一頁面上多次套用。 |
結論
這裡您應該注意的最顯著的差異是，一個元素只能有一個 ID 選擇器，而一個元素可以有多個類別選擇器。但是，ID 和類別選擇器都用於根據指派給元素參數的名稱來識別元素。
以上是HTML中id和class的區別的詳細內容。更多資訊請關注PHP中文網其他相關文章！