Classes and IDs

If you want to apply a style to all instances of a certain tag, then you simply reference that tag in your stylesheet.
If, on the other hand, you want to apply a style selectively, then you’re going to need to add either a class or an ID to the tag.
Classes are reusable. A document can contain any number of tags that use the same class, e.g.:
<p class="myclass">
An ID is unique. A document can only contain one instance of <p id="myid">.
Even though we can name our classes and IDs anything we wish, it’s still a good idea to try to use descriptive rather than visual terms. Describe a class as being "important" rather than "bigredbold".
If we combine the power of <div>s and IDs, we can take the semantic description of our documents even further than the tags provided by XHTML allow.
Most web pages can be divided up into sections like "main navigation", "sub navigation", "main content" "related material", etc.
XHTML doesn’t give us the tags to describe these chunks of content. But if we take the blank slate block-level tag (<div>) and give each section a unique identifier (ID), then we’ve taken semantic description to the next level.
If you mark up your pages with areas like <div id="branding">, <div id="footer">, etc. then you have a way to reference those chunks of content. You will then be able to affect their visual appearance and even change how they are positioned