css);
9. Open creating-and-styling-a-web-page-2.css and switch the values of color
and background in the first body rule.
body {
font: 62.5%/1.5 Verdana, Arial, Helvetica, sans-serif;
color: #ffffff;
background: #000000;
padding: 20px;
}
10. Replace the text-transform property/value pair from the h1 rule with color:
#bbbbbb;. For the blockquote rule, make the following amendments, which add a
border to the left and right edges, and some horizontal padding around the block
quote??™s contents.
blockquote {
margin: 0 100px;
border-left: 3px solid #888888;
border-right: 3px solid #888888;
padding: 0 20px;
}
11. Finally, amend the blockquote p rule as shown:
blockquote p {
font-weight: bold;
font-size: 1.0em;
}
THE ESSENTIAL GUIDE TO CSS AND HTML WEB DESIGN
22
Refresh the web page in the browser, and you should see it immediately change, looking
like that shown in the following image. Effectively, nothing in the web page was changed
(you could have overwritten the rules in creating-and-styling-a-web-page.css rather
than creating a duplicate style sheet)??”instead, the web page??™s design was updated purely
by using CSS. (Note that in the download files, there are two sets of documents for this
exercise??”one with the design as per step 7, and the other as per step 11, the latter of
which has the -2 suffix added to the HTML and CSS document file names.)
Although this was a very basic example, the same principle works with all CSS-based
design.
Pages:
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81