Horje
Difference Between HTML Class and ID

A class name can be used by multiple HTML elements, while an id name must only be used by one HTML element within the page:


Difference Between HTML Class and ID

Follow the code. We make Difference Between HTML Class and ID
index.html
Example: HTML
<!DOCTYPE html>
<html>
<head>
<style>
/* Style the element with the id "myHeader" */
#myHeader {
  background-color: lightblue;
  color: black;
  padding: 40px;
  text-align: center;
}

/* Style all elements with the class name "city" */
.city {
  background-color: tomato;
  color: white;
  padding: 10px;
} 
</style>
</head>
<body>

<h2>Difference Between Class and ID</h2>
<p>A class name can be used by multiple HTML elements, while an id name must only be used by one HTML element within the page:</p>

<!-- An element with a unique id -->
<h1 id="myHeader">My Cities</h1>

<!-- Multiple elements with same class -->
<h2 class="city">London</h2>
<p>London is the capital of England.</p>

<h2 class="city">Paris</h2>
<p>Paris is the capital of France.</p>

<h2 class="city">Tokyo</h2>
<p>Tokyo is the capital of Japan.</p>

</body>
</html>

Output should be:

Difference Between HTML Class and ID





Category:
Web Tutorial
Sub Category:
HTML id Attribute
Uploaded by:
Admin


Read Article
https://develop.horje.com/learn/1434/reference