Id vs Class Selectors

CSS not only allows specifying styles for your HTML elements, but also helps you specify your own selectors like, “class” & “id”. These are known as user defined selectors.

The id Selector

The id selector is used to specify a general style format for a single unique HTML element. It actually gives a name to a certain style.
The id selector uses attribute of this unique HTML element & is defined with "#" sign.

Example :

Code	Results
<HTML> <HEAD> <style type="text/css">#heading1 {color:blue; font-size:25px; font-family:impact;} </style> </HEAD> <BODY> <div ID="heading1"> <b class="headline">This is headline style bold</b> </div> </BODY> </HTML>	This is headline style bold

The class selector

Unlike id selector, the class selector specifies a style format for a group of HTML elements meaning that, a class selector is applicable on several elements.
The class selector uses the attributes of the HTML class & is defined with the "." Sign.

Example :

Code	Results
<HTML> <HEAD> <style type="text/css">.headline {color:blue; font-size:40px; font-family:impact;} </style> </HEAD> <BODY> <b class="headline">Headline style in bold</b> </BODY> </HTML>	Headline style in bold