印刷時に DIV がページ間で分割されないようにするにはどうすればよいですか?

印刷の問題: ページ間での DIV 分岐の防止

動的 DIV がページ間で半分にスライスされるという印刷上のジレンマに遭遇しましたか?この問題は、高さが可変の DIV 要素が多数含まれる長いドキュメントを印刷しようとすると発生します。

CSS による解決策

この問題に対処するには、CSS プロパティの Break-内側が助けになります。値回避を指定すると、レンダリング エンジンが DIV が途中で分割されるのを確実に防ぐことができます。コード スニペットは次のとおりです:

@media print {
  div {
    break-inside: avoid;
  }
}

このソリューションは、以下を含むすべての主要なブラウザでサポートされています。

• Chrome 50
• Edge 12
• Firefox 65
• Opera 37
• Safari 10

代替オプション

もう 1 つの実行可能なオプションは、改ページを使用することです-内側: 避けます。侵入の代わりに: 回避します。ただし、このアプローチは廃止されたため、慎重に使用する必要があります。

以上が印刷時に DIV がページ間で分割されないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。