CSS实现不同的打印和屏幕显示结果 -网页特效-网站制作-IT知道网(http://www.itwis.com)

CSS实现不同的打印和屏幕显示结果

来源：发布时间：2008-01-12 发布人：浏览：人次字体： [大中小]

通常的web页面中，我们要求打印结果和显示结果一样，但在一些报表或业务系统中，我们可能只需要打印页面中的一部分内容，例如我只要打印数据，但按钮和背景不需要打印，这是由业务需求决定的，我们可以想象一下，如果一张打印出来的发票中出现一个按钮，你会怎么想，估计要昏过去的，呵呵~~

好了，说完需求，我来说说如何实现，一种方法是为屏幕显示和打印分别准备一个css文件，如下所示：

用于屏幕显示的css：

用于打印的css：

注意，这两个css是放在一个web页面里面的。

还有一种是import方式：

@import url("css/printstylesheet.css") print;

</style>

最后一种写法是可以直接把屏幕显示样式和打印样式写在一个css文件中：

@media print {

h1 {

color: black;

}

h2 {

color: gray;

}

【↑返回顶部】【文章评论(0条)】【收藏本文】【打印本文】【关闭窗口↓】

↑上一篇：通过CSS来动态改变界面样式实例

↓下一篇：导航上用CSS标志当前页效果的实现

发布商链接

·导航上用CSS标志当前页效果的实现
·通过css改变图片显示的内容
·css固定定位实现悬浮效果
·CSS解决倾斜鼠标翻转导航制作麻烦问...
·网页表格制作之圆圈型表格的实现代码
·仿windows关机对话框的提示框效果代...
·淘宝在线状态和qq在线状态的生成代码
·网页CSS样式表学习技巧小记，供大家...
·无刷新更换页面样式例子供大家参考
·动态添加表单两法

§最新评论:（评论内容只代表网友观点，与本站立场无关！）

网名：验证码：

【所有评论】【↑返回顶部】

评　分： 12 345

评论内容：(不能超过500字，请自觉遵守互联网相关政策法规。[按 Ctrl+Enter 可直接提交]

注意:请勿在本站发布政治话题、色情及违反法律的内容。

IT知道网声明：刊登此文章是为了传递更多信息，文章内容仅供参考，转载请注明出处。


首页 ┆ 网站地图 ┆ 在线留言 ┆ 游戏资讯 ┆ 资源下载 ┆ 端午节祝福 ┆ 迅雷在线影视

编程学堂> JAVA专区 \| .NET专区 \| PHP 专区 \| ASP 专区 \| C/C++ \| JAVASCRIPT \| 数据库 \| 软件工程 \| 网络技术 \| 网站制作 \| 编程相关 \| 硬件资讯
业界相关> 业界新闻 \| 操作系统 \| 办公技巧 \| 病毒安全 \| 图形图像 \| 常用工具 \| 资源下载 \| 网站推广 \| 即时通讯 \| IT故事 \| IT健康 \| QQ---MSN