HTML and CSS Reference
In-Depth Information
➤
IDs:
An ID is a custom CSS selector, intended to be used once per HTML page.
Classes:
➤
A class is another custom selector, which can be used as many times as needed on a
web page.
➤
Compound:
Tags, IDs, and classes can be combined to create a compound selector, which
pinpoints a particular section of the page.
Tags
The use of HTML tags as a CSS selector is very straightforward. When an HTML tag, such as
<p>
,
is defined as a selector with CSS, all
<p>
tags are immediately affected unless another CSS style over-
rules it. With tag selectors, it is easy to implement broad, sweeping modifications to existing web
pages. This ability is both a blessing and a curse. You'll need to make sure that any tag styles created
work well in all page variations.
ids
A CSS ID is a custom selector intended for use once per HTML page. To define an ID selector, use a
leading number sign symbol, like this:
#header {
width: 960px;
}
An ID is applied to an HTML tag with the
ID
attribute:
<div id=”header”>
Note that the
#
symbol is only used when defining the CSS rule, not when applying it.
classes
The class selector is similar to the ID, except it may be used multiple times on a single page.
Additionally, instead of a leading number sign, a period is used to define a class selector,
like this:
.legalNotice {
font-size: small;
}
To apply the class selector to an HTML tag, use the
class
attribute:
<div class=”legalNotice”>
The names of classes and IDs must begin with a letter and not contain any white spaces or other
special characters. Similarly, classes and IDs are case-sensitive. In other words,
.legalNotice
is not
the same as
.LegalNotice
.
