Printlayouts
mit CSS

Eine Seite @page

@page {size: breite hoehe;

   margin: 23.33mm 31.11mm;}

Pseudo-Klassen :left, :right

@page:left {margin-left: 50mm;}

@page:right {margin-right: 50mm;}

Musterseiten

/* Definition der Seite mit @page */

@page teil {margin: 3.5cm 2.5cm 3cm 2.5cm;}

/* Zuweisung über Eigenschaft page */

div.section {page: teil;}

Seitenzahl

content: counter(page);

Kapitelnummern

/* Ausgeben */

h1:before {

 counter-increment: KapEbene1;

 content: counter(KapEbene1);

 }

/* Initialisieren */

body {counter-reset: KapEbene1;}

Lebende Kolumne

/* Ausgeben */

content: string(kol)

/* Initialisieren */

string-set: kol content()

Fußnoten werden gefloatet

.fn { float: footnote; }

Seitenbereich für Fußnoten-Floats

@footnotes {}

Counter für Fußnoten (vordefiniert)

footnote

Pseudo-Elemente für Fußnotenzähler und -marker

.fn::footnote-call { content: "[" counter(footnote) "]"; }

.fn::footnote-marker { font-weight: bold; }

Seitenverweis target-counter()

<p>Siehe Kapitel 5.</p>

a.verweis:after {

 content: " (Seite " target-counter(attr(href), page) ")";

 }

Inhaltsverweis target-content()

a.verweis {

 content: "Siehe " target-content(attr(href));

 }

Seitenumbruch

div.chapter {

 page-break-after: always;

 }

Bilder zusammenhalten

figure {

 page-break-inside: avoid;

 }

Umbruchoptionen (Absatz)
Hurenkinder und Schusterjungen

p {

 widows: 2;

 orphans: 2;

 }

Blocksatz

p {

 hyphens: auto;

 text-align: justify;

 }

CMYK
Für Hintergründe und Farben definierbar

div.box {

 background-color: device-cmyk(0, 0, 0, 20%);

 }

Auflösung von Abbildungen
Angabe der zu rendernden Auflösung als dpi-Wert

img {

 image-resolution: 300dpi;

 }