HTML and CSS Reference
In-Depth Information
Apply Your Knowledge
Reinforce the skills and apply the concepts you learned in this chapter.
Adding Menus to an Egyptian Web Site
Instructions:
Start Notepad++ and a browser. Using your browser, open the apply7-1.html file from
the Chapter07\Apply folder of the Data Files for Students. See the inside back cover of this topic for
instructions on downloading the Data Files for Students, or contact your instructor for information
about accessing the required files. The apply7-1.html file is the partially completed HTML file needed
for this exercise. Figure 7-17 shows the Apply Your Knowledge Web page as it should appear in the
browser after the necessary code is added.
add embedded style sheet for
navigation bar, background
color, and font styles
Figure 7-17
Perform the following tasks:
1. Examine the HTML file and its appearance in the browser.
2. Embed the following style sheet into the apply7-1.html file:
body
{font-family: Verdana, Arial, sans-serif;
background: #edbf79;}
a
{text-decoration: none; color: #5a3702;}
#menubar
{border-top: 4px solid #f4dab2; border-right: 4px
solid #e0a140; border-bottom: 4px solid #e0a140;
border-left: 4px solid #f4dab2; background-color:
#f5cb8a; color: #5a3702; height: 23px;}
.menu
{float: left; padding: 0.1em 3em 0.1em 0.5em;
cursor: default;}
