Wie Sie Seitenumbrüche im CSS-Druckstil markieren

Question

Ich muss sehen, wo genau der Browser Seitenumbrüche in der Druckvorschau einfügt, damit ich dieses Verhalten mit CSS-Eigenschaften ändern kann. Mit anderen Worten, ich muss den Seitenumbruch selbst stylen (zu Testzwecken natürlich), damit ich sehen konnte, wo der Seitenumbruch stattfinden wird, so dass ich weiß, welche Selektoren mit page-break-after/inside/before-Eigenschaften zu ändern sind.

Um dies zu verdeutlichen, suche ich NICHT nach Chrome Dev Tools Druckemulation. Dieses Tool zeigt leider nicht an, wie die Seite im Ausdruck aussehen wird (jeder kann seine Ergebnisse mit Ergebnissen im Druckvorschau-Fenster vergleichen, die in Chrome oder einem anderen Browser mit STRG P aufgerufen werden). Dieses Tool kann jedoch nützlich sein, wenn Sie herausfinden müssen, ob einige Ihrer CSS-Druckregeln bestimmte Bildschirmmedienregeln überschreiben oder nicht. Aber es hilft nicht viel in Situationen wie dieser, wenn Sie genaue Positionen von Browser-gerenderten Seitenumbrüchen finden müssen, um das Seitenumbruchverhalten manuell zu modifizieren.

Answer 1

Es sieht so aus, als ob Sie eine Vorschau benötigen, wie Ihre Seite aussehen wird, wenn das Druck-Stylesheet angewendet wird. Sie können dies mit Chrome tun, hier beantwortet: Faster way to develop and test print stylesheets (avoid print preview every time)?