Skip to main content

Creating a css style print sheet

Member for

3 years 1 month
Submitted by admin on

How do you create a Print Style Sheet so that the user's printer ink is not being run dry because of printed unnecessary images? There are three things a developer needs to remember when building this for a client. The first one is what the client needs? Yes, that means a conversation, ok be brave. You can do it. The next is setting up the style sheet CSS HTML link at the bottom of your HTML CSS links in the HTML document header tags, like the example below.

<header>
<link rel="stylesheet" href="style.css" type="text/css" media="all"/>
<link rel="stylesheet" href="print.css" type="text/css" media="print"/>
</header>

When the browser sees the media="print", it will only activate that style sheet when the user presses the print button. The only question left to ask is what CSS rules should I write for a print.css sheet? The answer is anything you like. I use the principle. What is it the user wants to print? (usually the content and maybe the logo). So I tried and made the text easy to read after it was published.