Please send questions to
st10@humboldt.edu .
<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Snazzy Screen/Print CSS Example</title>
<link rel="stylesheet" type="text/css" href="common.css" />
<link rel="stylesheet" type="text/css" media="print" href="print.css" />
<link rel="stylesheet" type="text/css" media="screen" href="screen.css" />
</head>
<body>
<div id="heading">
<h1>Snazzy Screen/Print CSS Example</h1>
<h2> (with thanks to W. Classon!) </h2>
</div>
<p class="screen-only">
This content will only show on the screen. It is of a silly nature, and
we would never subject our printer to such nonsense.
</p>
<p> Testing... 1... 2... 3... This is in a garish color
just to show that the common external CSS file indeed works
for both screen and print versions.
</p>
<table class="magical-table">
<tr class="odd"><td>Sample</td><td>Table</td><td>Data</td></tr>
<tr class="even"><td>Sample</td><td>Table</td><td>Data</td></tr>
<tr class="odd"><td>Sample</td><td>Table</td><td>Data</td></tr>
<tr class="even"><td>Sample</td><td>Table</td><td>Data</td></tr>
<tr class="odd"><td>Sample</td><td>Table</td><td>Data</td></tr>
<tr class="even"><td>Sample</td><td>Table</td><td>Data</td></tr>
</table>
<p class="screen-only">
<a href="http://validator.w3.org/check?uri=referer">
<img src="http://www.w3.org/Icons/valid-xhtml11"
alt="Valid XHTML 1.1" height="31" width="88" />
</a>
<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img src="http://jigsaw.w3.org/css-validator/images/vcss"
alt="Valid CSS!" height="31" width="88" />
</a>
</p>
</body>
</html>