技术成就梦想

知道用户需求,做到专注!c#,donet,Frameworks,UML,面向对象,设计模式!
  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

CSS实现局部打印

Posted on 2010-01-07 17:33  我不是高手  阅读(753)  评论(0)    收藏  举报

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
<style>
@media print{
INPUT {display:none}
}
</style>
</style>
</head>

<body>
</body>
</html>
在实现打印预览的时候,可以采用JS来完成这一功能,但这样会让所有在页面上的部分都答应出来,包括像“打印预览”这样的按钮也会打印,这样的情况,可以采用CSS来完成局部答应的功能。
        代码如下:


<style media=print>     
     .Noprint {   
        display:none;   
     }   
     
     .NextPage {   
        page-break-after:always;   
     }  
  input{display:none}
</style>    

这样,如果要某些内容不要打印出来,则元素的class为“Noprint”,若要内容在下一个页中打印,则该元素的class为“NextPage”。

说明,style media=print是说明该样式在打印的情况下起作