HTML and CSS Reference
In-Depth Information
Cascading Order.
You can import as many files as you want, but keep in mind that
when multiple style sheets are used, the style sheets may conflict over which selector
has control. There must be rules that determine what style sheet's rule has precedence.
The order that determines the outcome of the type of conflict is called the cascading
order. A full discussion can be found at
http://www.w3.org/TR/CSS2/cascade.html#cascad-
Rather than globally defining a style for an element, you can customize the style by
defining a class. The class style can be applied to individual tags when needed. The class
name, called the
class selector
, is preceded by a period and followed by the declaration
enclosed in curly braces.
FORMAT
.classname { style rules; }
EXAMPLE
.header { font-family: verdana, helvetica ; }
Once you have defined a class, it can be used on any of the HTML elements in the
body of the document as long as that element understands the style you have applied to
it. To apply the class, you use the
class attribute
. The class attribute is assigned the name
of the class; for example, for the
<p>
tag, you would stipulate
<p class=name>
where
name
is the name of the class.
EXAMPLE
14.13
<html>
1
<head><title>CSS Class Name</title>
2
<style>
3
p { margin-right: 30%;font-family: arial;
font-size: 16pt;
color:forestgreen; }
4
.bigfont { font-size: x-large; color:darkblue;
font-style:bold;}
5
.teenyfont { font-size:small;
font-style: italic;color:black;}
</style>
</head>
