HTML and CSS Reference
In-Depth Information
What if we move the font up the family tree?
If most elements inherit the
font-family
property, what if we move it up to
the
<body>
element? That should have the effect of changing the font for all
the
<body>
element's children, and children's children.
html
Now all
these eleme
nts are goin
g
to inher
it the font
-family.
body
p
p
p
h1
h2
And so are
their child
ren.
Remem
ber,
images
don't
have t
ext.
img
a
em
a
Wow, this is powerful. Simply by cha
nging the
font-family property in the body r
ule, we
could change the font for an entire
site.
What are you waiting for…give it a try
Open your “lounge.css” file and add a new rule that selects the
<body>
element.
Then remove the
font-family
properties from the headings and paragraph
rules, because you're not going to need them anymore.
He
re's w
hat
you'r
e go
ing t
o do.
Fi
rst,
add
a new
rule
tha
t sel
ects
body {
th
e <bo
dy>
elem
ent.
Then
add
the
font-family: sans-serif;
fo
nt-f
amily
prop
erty
wit
h a v
alue
of
sans
-ser
if.
}
h1, h2 {
font-family: sans-serif;
color:
gray;
}
Then, take the font-family
property out of the h1, h2
rule, as well as the p rule.
h1 {
border-bottom: 1px solid black;
}
p {
font family: sans serif;
color:
maroon;
}
