Classes and IDs: What’s The Difference?

Class and id selectors are integral to creating customiseable CSS based layouts. There are however, several differences between the two.

Ids are assigned to tags, like so: <tag id="cssidname">. They cannot start with a number and you cannot apply multiple ids to one tag. Also, each id can only appear once in a document although can appear multiple times across an entire site and multiple different ids can appear on the same page.

To customise a tag that has been assigned an id, this is how we do it:
#cssidname {
property: value;
}

Classes on the other hand can be used several times in the same document. Two classes can be assigned to the same tag but like ids cannot start with a number. You assign a class to a tag like so: <tag class="cssclassname"> and to assign two classes, like this: <tag class="cssclassname cssclasstwo">

To customise a tag that has been assigned a class, this is how we do it:
.cssclassname {
property: value;
}

You can assign a tag a class and an id at the same time, like so: <tag id="cssidname" class="cssclassname">

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>