CSS Cookbook, 3rd Edition

Chapter 10. Designing Web Pages for Printing

Introduction

To create a printer-friendly version of a web page, web developers traditionally would either manually convert the web page content to a separate stripped-down page design or use a script to dynamically generate a separate page design.

With CSS, however, you can automatically apply a new stylesheet to web documents as they are printed, thereby eliminating the time and server resources needed to create a printer-friendly page.

Support for print-media CSS is fairly commonplace these days. All of the major modern browsers support this aspect of the technology, including Firefox, Internet Explorer for Windows, Safari, Chrome, and Opera.

This chapter teaches the basics of how to tell the browser which stylesheet to use when sending a document to print. It also discusses how to switch graphics from web to print CSS, as well as a series of techniques for developing a document for printing.

Note

Because this book focuses on the practical, cross-browser nature of CSS, the recipes in this chapter are geared toward styling the contents of the page rather than dealing with the theory of CSS printing properties. For more information on CSS printing properties, see CSS: The Definitive Guide by Eric A. Meyer (O’Reilly).

Applying a Stylesheet for Printing to a Web Page

Problem

You want to create a printer-friendly page without having to create a separate HTML file.

Solution

First, create a separate stylesheet containing the CSS rules for printing. ...