HTML and CSS Reference
In-Depth Information
7 Using Advanced Cascading
Style Sheets
Introduction
In previous chapters, you used HTML tags and Cascading Style Sheets (CSS) to change
the way a Web page appears in a Web browser, such as adding italic, bold, colors, headings,
and tables. This is also known as the style of the Web page. In this chapter, you will
expand your knowledge of CSS to give added functionality to your Web pages. You will
i insert drop-down menus for your Web site visitors to use for navigation. This advanced
technique is done with more complex CSS code. You will also add pop-up image effects
using an advanced CSS technique. Using CSS is a better way to format your Web pages
as opposed to using tables. You have more flexibility using CSS versus tables for Web
page structure.
Project — Using Advanced Cascading Style Sheets
Jared Adam's Adventure Travel had a Web site created several years ago. Although the
Web site is well-designed and effective, they now want to improve their Web site with
drop-down menus and image effects. They hire you to enhance their Web site using
advanced Cascading Style Sheets (CSS).
At Mr. Adam's request, you use advanced Cascading Style Sheets to add a
drop-down menu, as shown in Figure 7-1b. Recognizing that the Jared Adam's
Adventure Travel Web site will continue to grow, you suggest that you modify the Web
site to use embedded and external Cascading Style Sheets (CSS). You explain to him that
Cascading Style Sheets maintain a consistent look across a Web site — especially Web
sites that contain many pages, and can give the pages a more polished look. You suggest
that you create an external style sheet that is linked to the other Web pages. This style
sheet, which can be easily linked into all pages in the Web site, is used to give the images
on the Web page a pop-up effect (Figure 7-1b). Additionally, you would like to create a
second external style sheet that can be used when printing, to print only the content
of a Web page and not the navigation bar. Mr. Adam is supportive of the plan and
encourages you to start as soon as possible.
HTML 324
Search WWH ::




Custom Search