HTML and CSS Reference
In-Depth Information
Overriding inheritance
By moving the
font-family
property up into the body, you've set that
font style for the entire page. But what if you don't want the sans-serif
font on every element? For instance, you could decide that you want
<em>
elements to use the serif font instead.
html
body
p
p
p
h1
h2
img
a
em
a
Well, then you can override the inheritance by supplying a
specific rule just for
<em>
. Here's how you add a rule for
<em>
to override the
font-family
specified in the body:
body {
font-family: sans-serif;
}
h1, h2 {
color:
gray;
}
h1 {
border-bottom: 1px solid black;
}
p {
T
o ov
err
ide t
he
font
-fa
mily
pro
pert
y
color:
maroon;
i
nher
ited
fr
om b
ody
, ad
d a
new
rul
e
}
selec
ting
em
wit
h th
e f
ont-
fam
ily
em {
prop
erty
va
lue s
et t
o se
rif.
font-family: serif;
}