一个不错的html 打印代码支持翻页

   2015-08-10 0
核心提示:这篇文章主要介绍了一个不错的html 打印代码支持翻页,非常实用,需要的朋友可以参考下
ylbtech_html_print

html打印代码,支持翻页


复制代码
代码如下:

<html>
<head>
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">
<title>看看</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>
.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 #000000 #000000 #000000;
border-style: solid;
border-top-width: 2px;
border-right-width: 2px;
border-bottom-width: 1px;
border-left-width: 1px;
}
.NOPRINT {
font-family: "宋体";
font-size: 9pt;
}
</style>
</head>
<body >
<center class="Noprint" >
<p>
<OBJECT id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 width=0>
</OBJECT>
<input type=button value=打印 onclick=document.all.WebBrowser.ExecWB(6,1)>
<input type=button value=直接打印 onclick=document.all.WebBrowser.ExecWB(6,6)>
<input type=button value=页面设置 onclick=document.all.WebBrowser.ExecWB(8,1)>
</p>
<p> <input type=button value=打印预览 onclick=document.all.WebBrowser.ExecWB(7,1)>
<br/>
</p>
<hr align="center" width="90%" size="1" noshade>
</center>
<table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
<tr>
<td colspan="3" class="tdp">第1页</td>
</tr>
<tr>
<td width="29%" class="tdp">&nbsp;</td>
<td width="28%" class="tdp">&nbsp;</td>
<td width="43%" class="tdp">&nbsp;</td>
</tr>
<tr>
<td colspan="3" class="tdp">&nbsp;</td>
</tr>
<tr>
<td colspan="3" class="tdp"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" class="tdp"><p>这样的报表</p>
<p>对一般的要求就够了。</p></td>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
</table>
<hr align="center" width="90%" size="1" noshade class="NOPRINT" >
<!--分页-->
<div class="PageNext"></div>
<table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
<tr>
<td class="tdp">第2页</td>
</tr>
<tr>
<td class="tdp">看到分页了吧</td>
</tr>
<tr>
<td class="tdp">&nbsp;</td>
</tr>
<tr>
<td class="tdp">&nbsp;</td>
</tr>
<tr>
<td class="tdp"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" class="tdp"><p>这样的报表</p>
<p>对一般的要求就够了。</p></td>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
</table>
<hr align="center" width="90%" size="1" noshade class="NOPRINT" >
<div class="PageNext"></div>
<table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp">
<tr>
<td class="tdp">第3页</td>
</tr>
<tr>
<td class="tdp">看到分页了吧</td>
</tr>
<tr>
<td class="tdp">&nbsp;</td>
</tr>
<tr>
<td class="tdp">&nbsp;</td>
</tr>
<tr>
<td class="tdp"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" class="tdp"><p>这样的报表</p>
<p>对一般的要求就够了。</p></td>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
 
标签: 打印 翻页
反对 0举报 0 评论 0
 

免责声明:本文仅代表作者个人观点,与乐学笔记(本网)无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
    本网站有部分内容均转载自其它媒体,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责,若因作品内容、知识产权、版权和其他问题,请及时提供相关证明等材料并与我们留言联系,本网站将在规定时间内给予删除等相关处理.

  • Vue集成lodop插件实现打印功能 vue打印console
    Vue集成lodop插件实现打印功能 vue打印console
    目录VUE简单使用lodop1.创建LodopFuncs.js文件2.在打印功能vue页面引入LodopFuncs3.执行打印方法4.打印接口函数官网样例说明5.完整页面示例VUE 集成LODOP插件打印Lodop、C-Lodop使用说明及样例http://www.lodop.net/LodopDemo.htmlVUE简单使用lodop1.创建Lodo
    03-08
  • netsuite凭证批量打印中涉及的html分页打印问题
    zeng.cz在打印HTML页面时控制分页,可以使用层来动态控制。  具体的方法是,在需要分页的地方动态添加如下代码:  div style="PAGE-BREAK-AFTER: always"/div这是一个经典应用,如果netsuite中涉及的批量凭证打印 需要用这个来控制每张凭证的页面的。很重
    03-08
  • angular2动态增加一行组件和删除组件示例改进版(增加了添加数据、清空数据、打印数据功能)
    angular2动态增加一行组件和删除组件示例改进版
    初始效果点击添加行 点击添加数据 点击打印数据 点击清空数据TS 部分代码讲解  /**   * 获取数组对象   */  get arrayList()  {    return this.fg.get('arrayList') as FormArray;  }  获取的 HTML页面的控件arrayList 对象 
    03-08
  • jQuery打印Html页面自动分页 jquery实现打印
    jQuery打印Html页面自动分页 jquery实现打印
    最近项目中需要用到打印HTML页面,需要指定区域打印,使用jquery.PrintArea.js 插件 用法: Javascript代码  $("div#printmain").printArea();  但还是会打印DIV后面的内容,这里可以使用CSS控制打印分页 Css代码  div style="page-break-after: a
    03-08
  • jquery打印不完整如何解决 jquery打印pdf文件
    本篇内容介绍了“jquery打印不完整如何解决”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!jquery打印不完整的解决办法:1、打开相应的js文件;2、在
    03-08
  • webpack生产环境取消console打印 webpack打包去
    在webpack.prod.conf文件下new UglifyJsPlugin({uglifyOptions: {compress: {warnings: false,drop_debugger: true,drop_console: true}}}),
    02-08
  • css去掉使用bootstrap框架后打印网页时预览效果
    在我们写网页的时候,超链接是链接各个页面的桥梁,也是搜索引擎爬虫(spider)收录网站页面的关键,因此,在每个网页中会有许多的超链。今天,一个同行妹妹在使用了bootstrap框架来搭建自己的网站时遇到了打印网页时在带有超链接文字的旁边出现了超链,然后
    02-08
  • 利用vue实现打印页面的几种方法总结 vue实现打印预览功能
    利用vue实现打印页面的几种方法总结 vue实现打
    目录1.第一种就是直接调用 window.print()方法2.第二种使用v-print3.第三种使用print.js总结 1.第一种就是直接调用 window.print()方法这种方法的坏处就是 默认打印整个页面,不能打印局部页面。2.第二种使用v-print首先先下载 npm install vue-print-nb --s
  • vue+element-ui前端使用print-js实现打印功能(可自定义样式)
    vue+element-ui前端使用print-js实现打印功能(
    print-js官网链接: https://printjs.crabbly.com/下载依赖npm install print-js --save在package.json文件中增加print-js依赖。"dependencies": {"axios": "^0.19.2","babel-polyfill": "^6.26.0","element-ui": "^2.15.6&q
  • HTML页面打印分页标签样式
    htmlhead  meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5"  title***上海市眼病防治中心病人结帐费用报表***/title  meta http-equiv="Content-Type" content="text/html;  charset=gb2312"  !--media=print 
    02-08
点击排行