We are going to take a look at CSS Media Types to set up a separate style sheet for our web pages specifically for printing
It is possible to control the output to a specific media device such as a printer, this is a part of the CSS2 specification so it has been available for a long time and is very well supported
The idea behind this concept is to make sure that web pages are designed for printing
It is possible to create a separate style sheet to use when the document is printed and this is fairly simple, just add another style sheet to the page, adding the media of print to the code
Always take a look at how the web page would look if printed using Print Preview in the browser to determine if or what you want to modify for printing before creating rules for print
You can hide or move page content to be sure it fits onto the web page when the page is printed
We will hide the navigation bar when the page is printed
To do this, we will add an empty style sheet called styles-print.css that is located within the course files for this chapter
To add a stylesheet to the page using the Sources panel in CSS Designer and browse to styles-print.css within the site files
Open the Conditional Usage area, choose media and select print from the second drop down menu
We can now add rules to the print style sheet that will only apply if the web page is being sent to a print device
Be sure to preview any print rules you add to the print version of the style sheet within Print Preview in the browser to be sure it looks the way you want it to when being printed
Setting Separate Styles for Screen & Print
Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.
Educator.com recommends Adobe Dreamweaver CC to use with our Dreamweaver CC course. Adobe Dreamweaver CC is the leading all-in-one visual development tool used by web designers and developers worldwide to create, publish, and manage their websites and mobile content. Membership includes the full version of Dreamweaver CC to download, install, and run on your computer. You will get immediate access to all the latest updates and new features as soon as they're released.