最近项目中有个需求要求打印web页面数据，但是碰到打印预览显示数据时，多的数据就不翼而飞了（不分页），搞的很是焦灼~

最先是以为纸张的问题，胡乱折腾了一番，把A4约硬是改成了LARGE号的纸，多的数据就显示出来了，但是大多打印机用的都是A4，这样就有问题了~

继续想办法改！

来无意看到一个强制分页的CSS， "page-break-before"，大喜，认为胜利的曙光即将到来，

但在测试中发现兼容性不好~

再查资料，说Firefox不允许将独立的表分割，将要分页的数据放在<p>标签或者<div>标签。

最后发现如果body中有style="overflow-y:auto"  属性，部分浏览器的"page-break-before"就不起作用

至此，问题解决 ，在此记录一下。

By Hgq

关于WEB页面的强制分页打印问题的更多相关文章

  1. web页面实现指定区域打印功能

    web页面实现指定区域打印功能 使用CSS,定义一个.noprint的class,将不打印的内容放入这个class内. 详细如下: <style media=print type="t ...

  2. 应用CSS的page-break-after属性 实现WEB页面强制分页打印

    虽然dedecms.com向大家介绍了很多CSS属性的相关知识,但有些非常冷门的属性还是有所欠缺.在B/S程序中,对打印页面的控制,CSS相对比较弱,例如: 自动分页, 就基本没啥实际用途.我们通常需 ...

  3. 打印web页面指定区域的三种方法

    本文和大家分享一下web页面实现指定区域打印功能的三种方法,一起来看下吧. 第一种方法:使用CSS 定义一 个.noprint的class,将不打印的内容放入这个class内. 代码如下: <s ...

  4. (转）WEB页面导出为Word文档后分页&横向打印的方法

    <html>    <HEAD>        <title>WEB页面导出为Word文档后分页&横向打印的方法 </title>    < ...

  5. 基于Metronic的Bootstrap开发框架经验总结（9）--实现Web页面内容的打印预览和保存操作

    在前面介绍了很多篇相关的<Bootstrap开发框架>的系列文章,这些内容基本上覆盖到了我这个Bootstrap框架的各个主要方面的内容,总体来说基本达到了一个稳定的状态,随着时间的推移可 ...

  6. js打印WEB页面内容代码大全

    第一种方法:指定不打印区域 使用CSS,定义一个.noprint的class,将不打印的内容放入这个class内. 详细如下: <style media=print type="tex ...

  7. 基于视觉的Web页面分页算法VIPS的实现源代码下载

    基于视觉的Web页面分页算法VIPS的实现源代码下载 - tingya的专栏 - 博客频道 - CSDN.NET 基于视觉的Web页面分页算法VIPS的实现源代码下载 分类: 技术杂烩 2006-04 ...

  8. （转）基于Metronic的Bootstrap开发框架经验总结（9）--实现Web页面内容的打印预览和保存操作

    http://www.cnblogs.com/wuhuacong/p/5147368.html 在前面介绍了很多篇相关的<Bootstrap开发框架>的系列文章,这些内容基本上覆盖到了我这 ...

  9. web页面内容打印总结

    web页面打印有两种,一种是直接调用window.print()命令操作,一种是使用ActiveX插件(Object标签)操作,但是第二种只支持IE内核的浏览器. 示例1: <!DOCTYPE ...

随机推荐

  1. django之模型层

    1. ORM MVC或者MTV框架中包括一个重要的部分,就是ORM,它实现了数据模型与数据库的解耦,即数据模型的设计不需要依赖于特定的数据库,通过简单的配置就可以轻松更换数据库,这极大的减轻了开发人员 ...

  2. python代码notepad++不变色问题。

    原来是文档后缀名是.txt造成的,应该改成.py,疏忽了...

  3. CSAPP 缓冲区溢出试验

    缓冲区溢出试验是CSAPP课后试验之一,目的是: 更好的理解什么是缓冲区溢出 如何攻击带有缓冲区溢出漏洞的程序 如何编写出更加安全的代码 了解并理解编译器和操作系统为了让程序更加安全而提供的几种特性 ...

  4. （洛谷）P1019 单词接龙

    题目描述 单词接龙是一个与我们经常玩的成语接龙相类似的游戏,现在我们已知一组单词,且给定一个开头的字母,要求出以这个字母开头的最长的"龙"(每个单词都最多在"龙" ...

  5. data相关应用

    文案参考:HTML5中的data-*属性和jQuery中的.data()方法使用 data属性选择器 $("li[data-id='1']")//选择li元素中data-id属性等 ...

  6. Eclipse配置Maven工具

    1.Maven安装,下载Maven二进行制文件: http://maven.apache.org/download.cgi 下载后解压,然后设置maven的bin目录到系统环境变量Path中,在cmd ...

  7. 深入浅出Hyper-V网络虚拟化（序）

    服务器虚拟化已经越来越普及,很多企业也都在尝试着将现有业务转换成虚拟化的方式来运行,即在一个物理服务器上虚拟出多个实例,而每个实例彼此隔离,就好像在使用一台真实主机一样:网络虚拟化也同样如此,在同一条 ...

  8. 一次失败的刷题经历:[LeetCode]292之尼姆游戏(Nim Game)

    最近闲来无事刷LeetCode,发现这道题的Accept Rate还是挺高的,尝试着做了一下,结果悲剧了,把过程写下来,希望能长点记性.该题的描述翻译成中文如下: 你正在和你的朋友玩尼姆游戏(Nim ...

  9. linux配置Hadoop伪分布安装模式

    1)关闭禁用防火墙: /etc/init.d/iptables status 会得到一系列信息,说明防火墙开着. /etc/rc.d/init.d/iptables stop 关闭防火墙 2)禁用SE ...

  10. 【转】Unity3D研究院之两种方式播放游戏视频

    http://www.xuanyusong.com/archives/1019   Unity3D中播放游戏视频的方式有两种,第一种是在游戏对象中播放,就好比在游戏世界中创建一个Plane面对象,摄像 ...