【转】html 页面打印并 分页
主要实现是PageNext样式,即:page-break-after: always;
此样式加在需要在之后分布的元素上
<html> <head> <title>***XXX市眼病防治中心XX病人结帐费用报表***</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <!--media=print 这个属性可以在打印时有效--> <style media="print"> .Noprint { display: none; } .PageNext { page-break-after: always; } </style> <style> body, td, th { font-size: 12px; } .tdp { border-bottom: 1 solid #000000; border-left: 1 solid #000000; border-right: 0 solid #ffffff; border-top: 0 solid #ffffff; } .tabp { border-color: #000000; border-collapse: collapse; } .NOPRINT { font-family: "宋体"; font-size: 12px; } </style> <script language="javascript"> var i = 0; function zoomL() { i++; document.getElementById("f").style.zoom = 1 + i / 3; } function zoomS() { i--; document.getElementById("f").style.zoom = 1 + i / 3; } </script> </head> <body> <object id="WebBrowser" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height="0" width="0" viewastext /> <input type="button" value="打印" onclick="document.all.WebBrowser.ExecWB(6,1)" class="NOPRINT"> <input type="button" value="直接打印" onclick="document.all.WebBrowser.ExecWB(6,6)" class="NOPRINT"> <input type="button" value="页面设置" onclick="document.all.WebBrowser.ExecWB(8,1)" class="NOPRINT"> <input type="button" value="打印预览" onclick="document.all.WebBrowser.ExecWB(7,1)" class="NOPRINT"> <input type="button" value="放大" onclick="zoomL();" class="NOPRINT"> <input type="button" value="缩小" onclick="zoomS();" class="NOPRINT"> <br /> <table width="90%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr align="center"> <td colspan="5"> <font size="3">XXX市眼病防治中心XX病人结帐费用报表***(1) </font> </td> </tr> <tr> <td> 汇总人次 5 </td> <td> 费用合计 15853.12 </td> <td> 统计日期 </td> <td> 制表人 023 </td> <td> 制表日期:2004-05-13 </td> </tr> </table> <table width="90%" border="1" align="center" cellpadding="2" cellspacing="0" bordercolor="#000000" class="tabp" id="f"> <tr> <td> 姓名 </td> <td> 住院号 </td> <td> 科室 </td> <td> 结帐日期 </td> <td> 出院日期 </td> <td> 费用合计 </td> <td> 医保交易费用 </td> <td> 分类给付费用 </td> <td> 非医保交易费 </td> </tr> <tr> <td> 王博 </td> <td> 1001 </td> <td> 1985-12-27 </td> <td> 1999-9-9 </td> <td> 22222222 </td> <td> aaa </td> <td> fffffff </td> <td> </td> <td> ooooooooo </td> </tr> </table> <hr align="center" width="90%" size="1" noshade class="NOPRINT"> <!--分页--> <div class="PageNext"> </div> <table width="90%" border="1" align="center" cellpadding="2" cellspacing="0" bordercolor="#000000" class="tabp"> <tr> <td> 第2页 </td> </tr> <tr> <td> 看到分页了吧 </td> </tr> <tr> <td> </td> </tr> <tr> <td> </td> </tr> <tr> <td> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="50%"> 这样的报表 对一般的要求就够了。 </td> <td> </td> </tr> </table> </td> </tr> </table> <table width="780%" border="1" class="Noprint"> <tr> <td> 能不能打印 </td> </tr> </table> </body> </html>