Wie drucke ich mit Seitenzahlen in @media print?

Lesezeit: 1 Minute

Wie drucke ich mit Seitenzahlen in @media print
Leon Freire

Ich suche diese Antwort schon seit einiger Zeit und konnte nichts finden, was richtig funktionieren könnte. Ich hatte diese beiden Ideen, die irgendwie so aussahen, als ob sie eine ganze Weile überhaupt nicht funktionierten:

  1. Eine Methode mit @page mit bottom-right. Verknüpfung

  2. Eine Methode mit fester Fußzeile. (Sollte in Firefox funktionieren) Link

Gibt es einen anderen Weg?

  • Können Sie mein Problem lösen stackoverflow.com/questions/46542080/…

    – Abhilash Narayan

    4. Okt ’17 um 16:44

Wie drucke ich mit Seitenzahlen in @media print
Leon Freire

Nach einer Weile habe ich etwas recherchiert, denke ich, dass ich hier etwas gefunden habe, das noch in verschiedenen Browsern getestet und vielleicht noch perfektioniert werden muss. Im Moment habe ich Chrome getestet und scheint gut zu funktionieren.

Im Grunde genommen konnte ich durch das Mischen beider Techniken diese Idee entwickeln, die (unter Last) a . repliziert h3 für jede p in der Arbeit (nur damit es für jede Seite genug läuft). Sie haben position: absolute und jeder subtrahiert 100vh so gehen sie zum Ende der anderen Seite.

Hier ist es: JSFiddle – Ohne Seitensumme

BEARBEITEN

Hier ist eine neue Version, die das anzeigen kann Seite insgesamt: JSFiddle – Mit Seitensumme

Hoffe das hat einen Nutzen!

  • dieser passt sich dem Inhalt nicht dynamisch an, sondern fügt nur alle 10 Absätze einen Zähler ein. Bitte korrigiere mich wenn ich falsch liege?

    – phil294

    4. August ’17 um 23:47

  • @Blauhirn Es gibt derzeit keine Möglichkeit, dies dynamisch zu tun. Diese Lösung kann leicht an jeden Fall angepasst werden. Ich habe für dieses Beispiel einen Durchschnitt von “p”s für eine Seite mit viel Text verwendet. Sie kann jedoch für jede Regel entsprechend angepasst werden. Für beliebig viele Elemente.

    – Leon Freire

    7. August ’17 um 11:35

.

212130cookie-checkWie drucke ich mit Seitenzahlen in @media print?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy