You can define your own selectors using the class selector and the identifier selector id.

The advantage of this is that you can represent the same HTML element differently depending on the class or id.

In CSS, the class selector is preceded by a half-width English period (.), and the id is preceded by a half-width English pound sign (#).

Looks like this:

#top { background-color: #ccc; padding: 1em } .intro { color: red; font-weight: bold; }
HTML with CSS connections use the attributes id and class. Like this:

The difference between id and class is that id is used on a unique element, while class is used on more than one element.

You can also apply selectors to a specific HTML element by placing the HTML selector in front, so p.jam { whatever } will be applied to paragraphs with class "jam".


An id name is usually uniquely defined in a page, so it is usually recommended to use class when defining css on a page, so that you can reuse your css. Leave the id for the most needed use JavaScript for html elements, etc.