HTML and CSS Reference
In-Depth Information
18. For the header group within the
article
element, create a style rule to: a) display a
background color with the value (189, 131, 82) with the background image
alisha.
png
displayed in the bottom-right corner with no tiling; b) set the text color to the
value (215, 181, 151); c) set the bottom margin to 10 pixels; d) set the height to
60 pixels; and e) indent the text 20 pixels. Set the size of
h1
headings within the
header group to 150% with normal weight. Set the size of
h2
headings to 110% with
normal weight.
19. For paragraphs within the
article
element, add styles to: a) set the font size to
90%; and b) set the margin to 15 pixels.
20. For the fi gure box, create a style rule to: a) fl oat the fi gure box on the left once the
left margin is clear; b) add a 21% left margin; c) set the width of the fi gure box to
79%; and d) set the background color to the value (149, 91, 42).
21. For the
div
element within the fi gure box, set the browser to display scroll bars
automatically if the content overfl ows the assigned space, and use the
white-space
property to prevent the content from wrapping to a new line.
22. For inline images within the fi gure box: a) set the margin to 10 pixels; and b) add
rounded corners with a radius of 10 pixels.
23. For the fi gure caption within the fi gure box, create a style rule to: a) set the back-
ground to white; b) set the font size to 80%, displayed in italic and centered; and
c) set the top margin to 5 pixels.
24. Add descriptive comments to the style sheet to identify the style rules for the differ-
ent sections of the Web page.
25. Save your changes to the fi le and then open
rose.htm
in your Web browser. Verify
that the layout and design of the page resemble that shown in Figure 4-77. View your
Web page under several different browser window widths to verify that the fl uid lay-
out correctly changes in response.
26. Submit your completed fi les to your instructor, in either printed or electronic form,
as requested.