Druckstile: So stellen Sie sicher, dass das Bild keinen Seitenumbruch umfasst

Wenn Sie ein Druck-Stylesheet schreiben, können Sie sicherstellen, dass sich ein Bild immer nur auf einer einzelnen Seite befindet, anstatt sich über mehrere Seiten zu erstrecken. Die Bilder sind viel kleiner als die Seite, aber basierend auf dem Dokumentfluss landen sie am unteren Rand der Seite und werden geteilt. Ein Beispiel für das Verhalten, das ich sehe, ist unten:

Page 1 |                    |
       |  (text text text)  |
       |  (text text text)  |
       |  ________________  |
       | | Top of image   | |
       |____________________|
       ------page break------
        ____________________
Page 2 | | Rest of image  | |
       | |________________| |
       |         …          |

Was ich möchte

Page 1 |                    |
       |  (text text text)  |
       |  (text text text)  |
       |                    |
       |                    |
       |____________________|
       ------page break------
        ____________________
Page 2 |  ________________  |
       | | Full image     | |
       | |                | |
       | |________________| |
       |         …          |

All diese Male habe ich mich über Floats in LaTeX beschwert und hier frage ich nach der gleichen Funktionalität ... Kann das gemacht werden? Ich bin nicht unbedingt besorgt darüber, dass es in allen Browsern funktioniert, da dies oft nur ein einmaliges Dokument ist, das ich schreibe, um es in ein PDF umzuwandeln.

Das einzige Mittel, an das ich denken kann, ist die Verwendung einer (oder möglicherweise mehrerer) der folgenden CSS-Regeln:

img {
    page-break-before: auto; /* 'always,' 'avoid,' 'left,' 'inherit,' or 'right' */
    page-break-after: auto; /* 'always,' 'avoid,' 'left,' 'inherit,' or 'right' */
    page-break-inside: avoid; /* or 'auto' */
}

Ich erinnere mich halb daran, dass diese Deklarationen nur für Elemente auf Blockebene gelten (Sie müssten also auch display: block;auf Ihrem Bild definieren oder eine Art Umbruchcontainer verwenden und die Regeln darauf anwenden (ob in einem Absatz, div, span) , Liste usw.)).

Einige nützliche Diskussionen hier: " Was sind die nützlichsten media="print"spezifischen, browserübergreifenden CSS-Eigenschaften? "

Verweise:

• page-break-after.
• page-break-before.
• page-break-inside.