上海网站建设
上海索溯网络科技有限公司 >> 网站建设知识 >> 怎样运用CSS实现不同的打印和屏幕显示结果?
» webdesign Knowledge

凭借互联网专业知识,为客户定制上海网站建设规划。我们不仅通过完善的项目管理措施来确保项目的顺利实施,还将网页优化的思想融入其中,并且我们运用最新的网站构建思想(DIV+CSS)来构建网站,使网站符合最新的WEB标准,使客户获得最佳的推广效果,最终实现预期的商业目标。


怎样运用CSS实现不同的打印和屏幕显示结果?

上海索溯网络科技有限公司 上海网站建设 上海网站建设 2008-4-25 13:17:29

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

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

用于屏幕显示的css:

<link rel="stylesheet" href="css/mainstylesheet.css" media="screen" />

用于打印的css:

<link rel="stylesheet" href="css/printstylesheet.css" media="print" /> 

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

还有一种是import方式:
<style type="text/css">
    @import url("css/printstylesheet.css") print;
</style>

最后一种写法是可以直接把屏幕显示样式和打印样式写在一个css文件中:
  @media print {
    h1 {
      color
: black;
    
}

    h2 
{
      color
: gray;
    
}

  }

责任编辑: 上海网站建设




联系索溯|上海网站建设,上海网页设计,
联系索溯|上海网站建设,上海网页设计,
上海索溯网络科技有限公司


总 机: 021-55063873
传 真: 021-55066448
E-mail: vip@revo.com.cn
网 址: Www.Revo.Com.Cn


在线支持:
QQ:380520592
QQ:249612154
QQ:727360729
友情链接|上海网站建设,上海网页设计

上海网站建设


>>了解更多链接请点击