Implementation advice
Media specific styles
You may have a need for a print specific version of your pages. Perhaps you want to strip the photographic banner, content images or navigation out of the printed page. More ambitiously you may want to completely rework the content layout. CSS provides for this. You can write media specific style sheets.
There are currently two ways to specify media dependencies for style sheets:
1 Specify the target medium from a style sheet with the @media or @import at-rules:
@import url("printfriendly.css") print; OR
@media print {
/* style sheet for print goes here */
}
2 Specify the target medium within the html. For example, in HTML 4.0 ([HTML40]), the "media" attribute on the LINK element specifies the target media of an external style sheet:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>Link to a target medium</TITLE>
<LINK rel="stylesheet" type="text/css" href="qg.css">
<LINK rel="stylesheet" type="text/css" media="print" href="print.css">
</HEAD>
Styles such as visibility: hidden; display: none; can be used, as appropriate, to remove page elements from the printed page.
The CUE Template (since v1.6) includes print specific styles in a separate style sheet, print.css. The '@media print' format described above is used in print.css You can add your own custom print styles to this file.