CSS打印：避免页面之间的半切割DIV？ [英] CSS Printing: Avoiding cut-in-half DIVs between pages?
问题描述
我为一个软件编写一个插件，需要一个大集合的项目，并将它们在WebView中的WebView中的Cocoa（使用WebKit作为其渲染器，所以基本上你可以假设这个HTML文件是在Safari中打开）。
I'm writing a plug-in for a piece of software that takes a big collection of items and pops them into HTML in a WebView in Cocoa (which uses WebKit as its renderer, so basically you can assume this HTML file is being opened in Safari).
它所创建的DIV是动态高度，但它们的变化不大。它们通常约为200像素。无论如何，每个文档大约有六百个这些项目，我有一个真正的时间让它打印。除非我幸运，在每页的底部和顶部有一个条目被砍成一半，这实际上使用打印输出非常困难。
The DIVs it makes are of dynamic height, but they don't vary too much. They're usually around 200px. Anyway, with around six-hundred of these items per document, I'm having a really rough time getting it to print. Unless I get lucky, there's an entry chopped in half at the bottom and top of every page, and that makes actually using printouts very difficult.
我试过page-前断页，后页断页，页断页，以及三者的组合无效。我认为可能是WebKit没有正确呈现指令，或者也许是我对如何使用它们的不了解。无论如何，我需要帮助。
I've tried page-break-before, page-break-after, page-break-inside, and combinations of the three to no avail. I think it might be WebKit not properly rendering the instructions, or maybe it's my lack of understanding of how to use them. At any rate, I need help. How can I prevent the cutting-in-half of my DIVs when printing?
推荐答案
这应该可以解决问题：
@media print
{
div{
page-break-inside: avoid;
}
}
- Chrome - 1.0 +
- Firefox（Gecko） - 19.0 +
- Explorer + 8.0 +
- Opera - 7.0 +
- Safari - 1.3+（312）
- Chrome - 1.0+
- Firefox (Gecko) - 19.0+
- Internet Explorer - 8.0+
- Opera - 7.0+
- Safari - 1.3+ (312)
这篇关于CSS打印：避免页面之间的半切割DIV？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
