| | |||||
| ||||||||
| Webmaster Tutorials Instructional webmaster-related how-to's and tutorials. |
![]() |
| | LinkBack | Thread Tools |
| | THREAD STARTER #1 (permalink) |
| NamePros Member Join Date: Jun 2005
Posts: 163
![]() | How to make a special CSS Stylesheet for print In my article yesterday, when I talked about how important the text on your website or blog is I mentioned that it is a good idea to have different stylesheets depending on if your user wants to print out the text or just read it on his screen. In this post I will show you how you make a special CSS Stylesheet for your users when they print out your homepage. It isn’t hard, in fact it is really easy! Your HTML code (header) might look something like this: HTML Code: <html> <head> <title>Name of page< /title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/> <link href="style.css" rel="stylesheet" type="text/css"/> </head> <body> HTML Code: < link rel="stylesheet" type="text/css" href="printstyle.css" media="print"/> HTML Code: <html> <head> <title>Labbportalen <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/> <link href="style.css" rel="stylesheet" type="text/css"/> <link rel="stylesheet" type="text/css" href="printstyle.css" media="print"/> </head> <body> Code: p {
font-family:"Times New Roman", Georgia, serif;
font-size:12pt;
}
img {
display:none;
}
#content {width:100%;} ????: NamePros.com http://www.namepros.com/webmaster-tutorials/259640-how-make-special-css-stylesheet-print.html ????: NamePros.com http://www.namepros.com/showthread.php?t=259640 Taken from: How to make a special CSS Stylesheet for print |
| |
| | #2 (permalink) | ||||
| Senior Member Join Date: Aug 2005 Location: East Yorkshire, England
Posts: 2,689
![]() ![]() ![]() ![]() ![]() ![]() ![]() | Thanks, I was wondering how to have a print stylesheet. I would give rep but...
| ||||
| |
| | #4 (permalink) |
| NamePros Regular Join Date: Jan 2006 Location: San Diego, CA
Posts: 734
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() | The key here is the media attribute on the link tag. <link rel="stylesheet" type="text/css" href="printstyle.css" media="print" /> ????: NamePros.com http://www.namepros.com/showthread.php?t=259640 You use the media attribute to specify what styles a specific media will receive. Media types: * screen (the default), for non-paged computer screens; * tty, for fixed-pitch character grid displays (such as the display used by Lynx); * tv, for television-type devices with low resolution and limited scrollability; * projection, for projectors; * handheld, for handheld devices (characterized by a small display and limited bandwidth); * print, for output to a printer; * braille, for braille tactile feedback devices; * aural, for speech synthesizers; * all, for all devices. |
| |
| | #5 (permalink) | ||||
| Account Suspended Join Date: Sep 2006
Posts: 1,059
![]() ![]() ![]() ![]() ![]() ![]() |
Thanks for sharing. travel abroad
Last edited by YesBrilliant; 04-11-2007 at 12:11 AM.
| ||||
| |