HTML id Global Attribute

Description

The global attribute id Defines a unique identifier for an element. The attribute should be used only once in a specific HTML document.

Some rules for IDs:

  • Use only letters of the alphabet ( AZ, az ), numbers, hyphens, underscores.
  • The identifier must not contain any spaces.
  • The identifier on the page is used for only one element.
  • Identifiers are case sensitive ( #container and #Container are different identifiers).

Syntax

#id { ... }

Values

  • idA name used to assign to the ID. Use only letters of the alphabet ( AZ, az ), numbers, hyphens, underscores.

Example

<!DOCTYPE html>
<html>
<head>
   <title>Global Attribute id</title>
<style> 
#main {
   text-align:center;
   color:red;
}
#index {
   color:blue;
}
</style>
</head>
<body>
   <h1 id="main">First level heading.</h1>
   <p id="index">Paragraph with assigned id as a style identifier.</p>
   <a href="#main">Using id as an anchor</a> (throws to the specified id).
   <p>Using JavaScript scripts (changing elements with a specific id):</p>
<script>
   function chg() {
      var x = document.getElementById("main");
      x.style.color = "white"; 
      x.style.backgroundColor = "orange"; 
   }
</script>
   <button onclick="chg()">Click!</button>
</body>
</html>

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
YesYesYes32YesYes
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
YesYes32YesYesYes