Mise en page à l'impression et sauts de page
@page size
break-after, break-before, break-inside, page, size, orphans, widows
Pour définir un format de page, on utilise le sélecteur @page :
- @page size: 8.5in 11in; margin: 2cm
- @page size:21.0cm 14.85cm; margin-top:1.5cm; margin-bottom:2cm
- @page :left margin-left:1.5cm; margin-right:2cm
- @page :right margin-left:2cm; margin-right:1.5cm
La propriété size peut prendre les valeurs suivantes :
- défaut : aucune valeur
- portrait
- landscape = format paysage (à l'italienne)
- inherit
- auto = Le format normal du mode de sortie (réglage normal du navigateur)
- un couple de longueurs : largeur de la page (par exemple 21.0cm) et hauteur de la page (par exemple 29.7cm).
On peut attribuer des marges à la page au moyen du bouton marges.
Nom de page
En attribuant à @page un identifiant - dans l'exemple ci-dessous italienne- vous pouvez créer une mise en page spéciale. Vous faites référence à cette mise en page en mettant l'identifiant dans la zone "nom de page" (propriété page).
Exemple:
<style type="text/css">@page italienne { size:landscape; }
div.recapitulatif {page:italienne; ... autres CSS...}
</style>
Effacer
Cliquez le bouton Effacer ❌ pour effacer les réglages présents.
Sauts de page
Les propriétés page-break-before, page-break-after… ayant le même usage ne sont donc plus gérées.
break-after
break-after spécifie si un saut de page, un saut de colonne ou un saut de région doit être effectué après l'élément.
break-before
break-before spécifie si un saut de page, un saut de colonne ou un saut de région doit être effectué avant l'élément.
break-inside
break-inside spécifie si un saut de page, un saut de colonne ou un saut de région doit être effectué à l'intérieur de l'élément.
| Valeur | Usage |
|---|---|
| auto | Valeur initiale qui ne force ni n'interdit de rupture (de page, de colonne ou de région) avant la boîte. |
| all | Force la rupture juste avant la boîte principale. La rupture a lieu pour l'ensemble des contextes de fragmentation. Ainsi si l'élément concerné est dans un conteneur multi-colonnes dans un média paginé, il y aura une rupture de colonne et une rupture de page. |
| always | Force la rupture juste avant la boîte principale. Le type de rupture dépend du contexte de fragmentation englobant l'élément. Si l'élément est situé dans un conteneur multi-colonne, une rupture de colonne sera ajoutée. Si l'élément est situé dans un média paginé (mais pas dans un conteneur multi-colonnes), la rupture introduite sera une rupture de page. |
| avoid | Empêche toute rupture (de page, de colonne ou de région) avant la boîte. |
| avoid-page | Empêche toute saut de page avant la boîte de l'élément. |
| page | Force un saut de page avant la boîte de l'élément |
| left | Force un ou deux saut de page avant la boîte de l'élément afin que la prochaine page soit une page gauche. |
| recto | Force un ou deux sauts de page avant la boîte de l'élément afin que la prochaine page soit une page recto (une page droite pour le sens de lecture gauche à droite et une page gauche pour le sens de lecture droite à gauche). |
| right | Force un ou deux saut de page avant la boîte de l'élément afin que la prochaine page soit une page droite. |
| verso | Force un ou deux sauts de page avant la boîte de l'élément afin que la prochaine page soit une page verso (une page gauche pour le sens de lecture gauche à droite et une page droite pour le sens de lecture droite à gauche). |
| avoid-column | Empêche toute rupture de colonne avant la boîte de l'élément. |
| column | Force une rupture de colonne de page avant la boîte de l'élément. |
| region | Force une rupture de région avant la boîte de l'élément. |
| avoid-region | Empêche toute rupture de région avant la boîte de l'élément. |
Orphelins et veuves
A l'impression, un paragraphe peut se retrouver scindé sur une page et la page suivante :
- un orphelin (orphans) est une ligne de ce paragraphe en bas de la page.
- une veuve (widows) est une ligne de ce paragraphe en haut de la page suivante.
Le réglage par défaut est 2.