HTML and CSS Reference
In-Depth Information
Page One
Page Two
On a referral from the Starbuzz
CEO, you've been asked to
come in and consult on style
changes to PetStorz main
page. How quickly would you
understand the PetStorz web
page if you were shown Page
One?
h1
h1
div id=“cats”
h2
h2
p
p
h2
div id=“dogs”
h2
p
What about Page Two?
p
p
p
p
img
p
img
Adding some style
h1
Okay, so you've added some logical
structure to the PetStorz page, and you've
also labeled that structure by giving each
<div> a unique id. That's all you need
to start styling the group of elements
contained in the <div> .
div id=“cats”
h2
p
div id=“dogs”
Her e we h ave tw o rule s, one
h2
for each < div>. Each <div> is
sele cted b y an i d selec tor.
p
Eac h rule sets t he
bac kgroun d-ima ge
pro perty. For c ats we
hav e a leo pard i mage,
and for d ogs we have
a m utt im age.
#cats {
background-image: url(leopard.jpg);
}
p
#dogs {
background-image: url(mutt.jpg);
}
Search WWH ::




Custom Search