Roots
Back

CSS IDs

What are IDs in CSS?

IDs are very similar to classes; they provide a way for you to specify a set of properties to apply to a given piece of HTML. The difference between the two lies in what you should use them for. One class can be applied to many different pieces of HTML, but an ID should only be used once on a page.

How to create a new ID

Use the following code in your CSS file;

#idname { property: value; }

idname - The name of this ID.

Then for any HTML element that has an id attribute, you can write;

<tagname id="idname">

tagname - The HTML tag.
idname - The name you gave to the ID.

Tag-specific IDs

You can also have tag-specific IDs in the same way as tag-specific classes. Simply use the following code in your CSS file, and write the HTML as for general IDs;

tagname#idname { property: value; }

tagname - The HTML tag you want this ID to work with.
idname - The name of this ID.