使用CSS 控制打印范围
时间:2010-09-13 来源:raifei
面向打印的CSS设置2007年10月24日 星期三 20:09首先要在<head>中添加CSS引用标记以指定打印用的CSS:
<link rel="stylesheet" href="打印用CSS的地址" type="text/css" media="print" />
注意关键在于最后的 media="print" ,这个选项告诉浏览器这个CSS是为打印准备的。因此,你原来的CSS的引用就应当加上 media="screen" 选项。总体代码如下:
<link rel="stylesheet" href="显示用CSS的地址" type="text/css" media="screen" />
<link rel="stylesheet" href="打印用CSS的地址" type="text/css" media="print" />
然后书写CSS文件。首先当然是body的属性设置:
body {
font-family: "lucida sans unicode",georgia;
font-size: 12pt;
color: #000000;
background-color: #FFFFFF;
background-image: none;
.Noprint{display:none;}
}
为超链接加上下划线,并去掉图片的边缘:
a {
text-decoration: underline;
color: #000000;
}
img {
border: 0;
}
然后隐藏掉不宜打印的部分,如页眉、页脚、侧边栏等:
#header, /* 页眉 */
#footer, /* 页脚 */
#sidebar, /* 侧边栏 */
#commentform, /* 评论输入表单 */
#navigation { /* 页面导航 */
display: none;
}
这样打印结果就比原来更容易阅读了