19

page-break-inside:avoidCSS命令は、HTMLドキュメントが印刷されるときにdiv内のページ分割を防ぐことになっていることを理解しています。インターネットを検索したところ、OperaとIE8でのみサポートされていることがわかりました。Firefox（3.6）または8未満のIEバージョンでページ分割を防ぐことができる回避策はありますか？

4

4 に答える 4

3

申し訳ありませんが、私の答えは「不可能」ですが、誰かが私が間違っていることを証明していただければ幸いです.

最近同じ問題に遭遇しました。少し調査した後、そのまま使用することにしました。

page-break-after: always;

数要素ごとに。

http://reference.sitepoint.com/css/page-break-inside

http://reference.sitepoint.com/css/page-break-after

于 2012-03-27T18:58:51.627 に答える
2

Firefox 以外の場合は、

.dontsplit { border: 2px solid black; page-break-inside: avoid; }

動作します。ただし、Firefox 用ではありません。Firefox では、高さを確認し、必要に応じて追加page-break-after: always;する必要があります。

平均して、余白は上下で 1 インチになります。そこで、10 インチのページが消費するピクセル数を測定するために、これを使用しました。

var pageOfPixels;
(function(){
    var d = document.createElement("div");
    d.setAttribute("style", "height:9in;position:absolute;left:0px;top:0px;z-index:-5;");
    document.body.appendChild(d);
    pageOfPixels = $(d).height();
    d.parentNode.removeChild(d);
})();

それぞれに多くの段落が含まれる多くの div がありました。そこで、それらを繰り返し処理し、現在のページの現在の高さを pageOfPixels 値と比較しました。

var currentPosition = 0;
$('.printDiv').each(function (index, element) {
    var h = $(this).height();
    if (currentPosition + h > pageOfPixels) {
        //add page break
        $('.printDiv').eq(index - 1).css("page-break-after", "always");
        currentPosition = h;
    } else {
        currentPosition += h;
    }
});

これはFirefoxでうまくいきました。

于 2013-01-15T23:40:22.667 に答える
2

white-space:nowrap代わりに使用してみてください。これにより、少なくとも画面上でテキストが要素内で壊れるのを防ぐことができます。それが印刷メディアにどのように変換されるかはわかりませんが、試してみる価値はあります。

詳細: http://www.blooberry.com/indexdot/css/properties/text/whitespace.htm

于 2012-04-06T22:06:07.903 に答える
0

最初のものを除いて、要素内のすべての要素を一致させ、それらをブレークビフォアにしないのはどうですか

#yourelement *+*{
    page-break-before: avoid;
}
于 2011-04-16T19:02:59.423 に答える