当前位置:  开发笔记 > 前端 > 正文

哪些浏览器支持使用CSS和page-break-inside元素进行分页符操作?

如何解决《哪些浏览器支持使用CSS和page-break-inside元素进行分页符操作?》经验,为你挑选了1个好方法。

我正在尝试使用page-break-inside CSS指令,其类将附加到div标签或表标签(我认为这可能仅适用于块元素,在这种情况下它必须是桌子).

我已经尝试了所有可能描述如何做到这一点的教程,但没有任何作用.这是一个浏览器支持的问题,还是有人真正得到了这个工作,CSS的确切位置如下所示:

@media print {

  .noPageBreak {
     page-break-inside : avoid;
  }
}

sequoia mcdo.. 5

Safari 1.3及更高版本(不知道4)支持page-break-inside(试试看,或者参见http://reference.sitepoint.com/css/page-break-inside).Firefox 3或IE7(不知道8)也没有.

从实际意义上说,对这个属性的支持很难看,在这一点上使用它根本没有意义.如果有10%的访问者拥有可以支持此功能的浏览器,那么您会很幸运.

我使用的解决方案是添加

page-break-after:always

到某些div,或在你想要休息的地方添加一个"分页器"div.我知道,这非常简陋,因为它没有达到您想要的效果,并且导致内容无法到达打印页面的底部,但遗憾的是没有更好的解决方案(证明我错了!).

另一种方法是创建一个样式表,删除所有无关元素(display:none)并使主要内容在一个主列中流动.基本上,将其转换为单列,纯文本文档.

最后,在打印机样式时避免浮动和列,它可以使IE(和FF)行为古怪.



1> sequoia mcdo..:

Safari 1.3及更高版本(不知道4)支持page-break-inside(试试看,或者参见http://reference.sitepoint.com/css/page-break-inside).Firefox 3或IE7(不知道8)也没有.

从实际意义上说,对这个属性的支持很难看,在这一点上使用它根本没有意义.如果有10%的访问者拥有可以支持此功能的浏览器,那么您会很幸运.

我使用的解决方案是添加

page-break-after:always

到某些div,或在你想要休息的地方添加一个"分页器"div.我知道,这非常简陋,因为它没有达到您想要的效果,并且导致内容无法到达打印页面的底部,但遗憾的是没有更好的解决方案(证明我错了!).

另一种方法是创建一个样式表,删除所有无关元素(display:none)并使主要内容在一个主列中流动.基本上,将其转换为单列,纯文本文档.

最后,在打印机样式时避免浮动和列,它可以使IE(和FF)行为古怪.

推荐阅读
手机用户2402852387
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有