ID Selectors in CSS

You can define style rules based on the id attribute of the elements. All the elements having that id will be formatted according to the defined rule.

 #black {
   color: #000000;
}

This rule renders the content in black for every element with id attribute set to black in our document. You can make it a bit more particular. For example:

h1#black {
   color: #000000;
}

This rule renders the content in black for only <h1> elements with id attribute set to black.

The true power of id selectors is when they are used as the foundation for descendant selectors, For example:

#black h2 {
   color: #000000;
}

In this example, all level 2 headings will be displayed in black color when those headings will lie within tags having id attribute set to black.