• CSS class selectors defined with a period "."
• CSS id selectors defined with a hash "#"
• CSS selectors are defined as the HTML attribute.

CSS id Selector

• The id selector is used to specify a style for a single, unique element.
• The id selector uses the id attribute of the HTML element, and is defined using the hash symbol "#"
• The style rule below will be applied to the element with id="area1"

CSS class Selector

• The class selector can be used by multiple elements.
• The class selector uses the class attribute of the HTML element, and is defined using the period symbol "."
• The style rule below will be applied to the element with class="pesudo"

.pesudo {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
background-color: transparent;
width: 80%;
margin-left: auto;
color: #333;
font-size: 14px;
margin-right: auto;
margin-top: 60px;
text-align: center;
}

Another advantage of using cascading style sheets (CSS) is you have total control over the div tags that make up your page. Amending the CSS code will automatically update multiple pages within your website that are using the specific ID or Class you have altered.

Unless of course the selector and associated attributes are locked as part of the template, if you do plan on locking a particular part of your page to the template like your header, navigation and footer there is no need to make them class selectors as they will be locked to the template. It is really the selectors that appear within editable regions you have created we need to focus on; if you plan on calling upon the attributes to use on multiple pages then you should apply the class selector.