我有一个生成优惠券的页面。每张优惠券都是一个 div
,其高度因内容而异。我想在每一页上打印尽可能多的优惠券,但我不希望优惠券被分成几页。 CSS 属性 page-break-inside
正是我所需要的。但是,我需要它才能在 Firefox 和/或 Chrome 上工作。和 this is not supported . Two years和 one year ago问了同样的问题,对此没有好的选择。我们正在进一步开发大量 CSS3/HTML5/整体浏览器...是否有其他方法可以使它正常工作?
例子在这里: http://jsfiddle.net/e3U66/2/
假设页面在打印时尺寸为 1000 像素。我希望第二个 DIV 出现在第二页上,否则它会在第一页和第二页上分开。此代码适用于 Opera,但不适用于 FF 或 Chrome。
最佳答案
为什么不呢,页面加载完你的内容后,用js滚动内容,把div
的高度加起来。
一旦达到 1000px
或您确定的任何页面高度,然后插入一个空白 div
样式为 page-break-before
在最新的 div 之前。
关于css - page-break-inside : avoid 的替代方案,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6104622/