Open In App

CSS #id Selector

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

The “#” CSS id selector is used to set the style of the given id. The id attribute is the unique identifier in an HTML document. The id selector is used with a # character. 

Syntax:

#id {
    // CSS property
}

Example 1: 

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>#id selector</title>
    <!-- CSS property using id attribute -->
    <style>
        #gfg1 {
            color: green;
            text-align: center;
        }
  
        #gfg2 {
            text-align: center;
        }
    </style>
</head>
  
<body>
  
    <!-- id attribute declare here -->
    <h1 id="gfg1">GeeksforGeeks</h1>
    <h2 id="gfg2">#id selector</h2>
</body>
  
</html>


Output:

  

Example 2:

HTML




<!DOCTYPE html>
<html>
<head>
    <title># CSS id selector</title>
    <!-- CSS property using id attribute -->
    <style>
        #geek, #gfg {
            color: green;
            text-align: center;
            background-color:antiquewhite;
        }
    </style>
</head>
<body>
    <!-- id attribute declare here -->
    <h1 id="geek">GeeksforGeeks</h1>
    <h2 id="gfg">Multiple id style at once</h2>
</body>
</html>


Output:

 

Supported Browsers: The browser supported by the id selector are listed below:

  • Google Chrome 1 and above
  • Edge 12 and above
  • Internet Explorer 3 and above
  • Firefox 1 and above
  • Safari 1 and above
  • Opera 3.5 and above


Last Updated : 07 Jun, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads