HTML and CSS Reference
In-Depth Information
CHECKPOINT 7.1
1. Describe a reason to organize the files in a Web site using folders and subfolders.
2. State a reason to use an unordered list to configure navigation links.
3. You are using CSS pseudo-classes on a Web page to configure the navigation links to
look like buttons. You want the “regular” links in the Web page content to be configured
as they normally would (not look like a button). Describe how you could configure the
styles and XHTML to accomplish this.
Even though the advent of the “paperless society” has been talked about for decades,
the fact is that many people still love paper and you can expect your Web pages to be
printed. CSS offers you some control over what gets printed and how the printouts are
configured.
This is easy to do using external style sheets. Create one external style sheet with the
configurations for browser display and a second external style sheet with the special
printing configurations. Associate both of the external style sheets to the Web page
using two
<link>
elements. The
<link>
elements will utilize a new attribute, called
media
which is described in Table 7.2.
Table 7.2
The
media
attribute
Value
Purpose
screen
The default value; indicates the style sheet that configures typical
browser viewport display on a color computer screen
print
Indicates the style sheet that configures the printed formatting
handheld
Indicates the style sheet that configures display on handheld
mobile devices
Modern browsers will use the correct style sheet depending on whether they are rendering
a screen display or preparing to print a document. Configure the link element for your
browser display with
media="screen"
. Configure the link element for your printout
with
media="print"
. An example of the XHTML follows:
<link rel="stylesheet" href="wildflower.css" type="text/css"
media="screen"
/>
<link rel="stylesheet" href="wildflowerprint.css" type="text/css"
media="print"
/>
Often
display:none
is used in the print style sheet to prevent banner ads, navigation,
or other extraneous areas from appearing on the printout. Another common practice is to
configure the font sizes on the print style sheet to use
pt
sizes—this will better control
the text on the printout. You can also use styles to configure areas in the document, such
as detailed contact info, that are only printed out and do not appear in the browser
Search WWH ::
Custom Search