Le modèle de la page enrichit le modèle de mise en forme visuel et prend en compte les coupures de page.
2.
Le modèle de la page de CSS2 définit la mise en forme d'un document dans une aire rectangulaire, la boîte de page, celle−ci ayant une largeur et une hauteur limitées. La boîte de page ne correspond pas forcément à la feuille définitive sur laquelle le document sera rendu (une feuille de papier, un transparent, un écran, etc.). Le modèle de la page spécifiant la mise en forme dans la boîte de page, le transfert de cette dernière vers la feuille est du ressort de l'agent utilisateur. Quelques modalités de transfert :
D'une boîte de page vers une feuille (ex. pour une impression en recto) ;
•
De deux boîtes de page vers les deux faces d'une même feuille (ex. pour une impression en recto verso) ;
•
D'un (petit) nombre N de boîtes de page vers une seule feuille (appelé "vignette") ;
•
D'une (grande) boîte de page vers des feuilles plus petites, la page étant répartie sur plusieurs d'entre elles (appelé "mosaïque") ;
•
Pour la création de signatures. Une signature est un ensemble de pages imprimées sur une feuille, qui, une fois pliée et massicotée comme pour un livre, apparaissent dans le bon ordre ;
•
Vers l'impression d'un document en plusieurs formats ;
•
Vers un fichier.
•
Bien que CSS2 ne définisse pas la manière dont les agents utilisateurs doivent transférer les boîtes de page vers leurs feuilles cibles, celui−ci inclut certains mécanismes pour leur signifier la dimension et l'orientation de celles−ci.
13.2 Les boîtes de page : la règle @page
La boîte de page est une aire rectangulaire comportant deux parties :
L'aire de la page. Celle−ci contient les boîtes qui y sont disposées. Les bords de l'aire de la page font office de bloc conteneur initial pour la mise en page survenant entre les coupures de page ;
•
L'aire de marge, qui entoure l'aire de la page.
•
Note : En CSS2, les propriétés de bordure et d'espacement ne s'appliquent pas aux pages, ceci pourrait être le cas ultérieurement.
Les auteurs spécifient les dimensions, l'orientation, les marges, etc. d'une boîte de page au travers d'une règle
@page. Une telle règle consiste en le mot−clé "@page", qui est un sélecteur de page (suivi, en option, par une pseudo−classe de page, sans blanc intermédiaire), et d'un bloc de déclaration (qu'on dit être dans le contexte de la page).
Le sélecteur de page précise lesquelles des pages sont concernées par les déclarations. En CSS2, les sélecteurs de page peuvent désigner chacune des pages de gauche, chacune des pages de droite ou une page avec un nom donné.
La propriété 'size' donne les dimensions de la boîte de page, l'aire de marge étant déduite.
Exemple(s) :
Par exemple, cette règle @page produit une taille de boîte de page de 8.5 x 11 pouces et une marge de '2cm' sur chacun des côtés entre le bord de la boîte de page et l'aire de la page :
@page { size: 8.5in 11in; margin: 2cm }
La propriété 'marks', dans une règle @page, spécifie les repères de coupe et d'alignement pour la boîte de page.
13.2.1 Les marges de la page
Les propriétés de marge ('margin−top', 'margin−right', 'margin−bottom', 'margin−left' et 'margin') s'appliquent dans le contexte de la page. L'illustration suivante montre les relations entre la feuille, la boîte de page et les marges de la page :
Les valeurs calculées des marges de la boîte, en haut ou en bas de la page, sont égales à '0'.
La notion de police étant étrangère au contexte de la page, ainsi les unités 'em' et 'ex' ne sont pas admises. Les valeurs en pourcentage des propriétés de marge se rapportent aux dimensions de la boîte de la page, à la largeur de celle−ci pour les marges gauche et droite, à la hauteur, pour les marges du haut et du bas. Les autres unités définies respectivement à leurs propriétés sont admises.
Des valeurs de marge négatives (pour la boîte de la page, ou pour certains éléments) ou un positionnement absolu peuvent placer un contenu en dehors de la boîte de la page, aussi celui−ci peut être "coupé" (par l'agent utilisateur, par l'imprimante ou, finalement, par le massicot).
13.2.2 La taille de la page : la propriété 'size' 'size'
Valeur : <longueur>{1,2} | auto | portrait | landscape | inherit Initiale : auto
S'applique à : un contexte de page Héritée : sans objet
Pourcentage : sans objet Médias : visuel, paginé
Cette propriété spécifie la taille et l'orientation d'une boîte de page.
La taille d'une boîte de page peut être soit "absolue" (de taille fixe), soit "relative" (de taille variable, celle−ci s'adaptant aux tailles des feuilles disponibles). Les boîtes de page relatives permettent aux agents utilisateurs une mise à l'échelle du document pour une utilisation optimale de la taille de la cible.
La propriété 'size' admet trois valeurs capables de créer une boîte de page relative : auto
La boîte de la page se conforme à la taille et l'orientation de la feuille cible ; landscape
Surclasse l'orientation de la feuille cible. La boîte de la page a la même taille que celle de la cible, les côtés de la boîte les plus longs sont horizontaux ;
portrait
Surclasse l'orientation de la feuille cible. La boîte de la page a la même taille que celle de la cible, les côtés de la boîte les plus courts sont horizontaux.
Exemple(s) :
Dans cet exemple, les bords externes de la boîte de la page s'aligneront sur ceux de la cible. La valeur en pourcentage de la propriété 'margin' se rapporte à la taille de la cible, ainsi, quand la feuille cible a pour dimensions 21.0cm x 29.7cm (format A4), les marges seront 2.10cm (horizontalement) et 2.97cm (verticalement) :
@page {
size: auto; /* auto est la valeur initiale */
margin: 10%;
}
Les valeurs de longueur de la propriété 'size' créent une boîte de page de taille absolue. Quand on ne spécifie qu'une seule valeur, la largeur et la hauteur de la boîte de la page sont les mêmes (c.à.d. une boîte carrée). La boîte de la page étant le bloc conteneur initial, la propriété 'size' n'admet pas de valeurs en pourcentage.
Exemple(s) : Par exemple :
@page {
size: 8.5in 11in; /* width height */
}
Ici, la boîte de la page a une largeur de 8.5in et une hauteur de 11in. Les dimensions requises pour la feuille cible sont 8.5 x 11 pouces, au moins.
Les agents utilisateurs peuvent autoriser un certain contrôle du transfert de la page vers la feuille (c.à.d. la rotation d'une boîte de page absolue en vue de son impression).
Le rendu d'une boîte de page qui ne tient pas sur une feuille cible
Quand la boîte de la page ne tient pas dans la feuille cible, l'agent utilisateur peut exercer : Une rotation de la boîte de 90° si cela permet de la faire tenir dans la feuille ;
•
Une diminution de l'échelle de la page pour la faire tenir dans la feuille.
•
L'agent utilisateur devrait prévenir l'utilisateur avant d'effectuer ces opérations.
Le positionnement de la boîte de la page sur la feuille
Quand la boîte de la page est plus petite que la feuille cible, l'agent utilisateur est libre de la placer n'importe où dans la feuille. Cependant, on recommande que celle−ci soit centrée dans la feuille, ce qui permet un certain alignement sur une feuille au recto et au verso, et aussi d'éviter d'éventuelles pertes d'information quand l'impression a lieu trop près du bord de la feuille.
13.2.3 Les repères de coupe : la propriété 'marks' 'marks'
Valeur : [ crop || cross ] | none | inherit Initiale : none
S'applique à : un contexte de page Héritée : sans objet
Pourcentage : sans objet Médias : visuel, paginé
Pour les impressions de qualité, on ajoute souvent des repères en dehors de la boîte de la page. Cette propriété indique si des repères de coupe, ou d'alignement, ou les deux en même temps, doivent apparaître, ou non, en dehors des limites de la boîte de la page.
Les repères de coupe indique l'endroit où la page doit être coupée. Les repères d'alignement (ou aussi, de cadrage ou d'intersection) sont employés pour aligner les feuilles.
Ces repères ne sont visibles que pour des boîtes de page absolues (voir la propriété 'size'). Dans le cas des boîtes relatives, la boîte de page s'aligne sur cible, les repères se trouvant hors de la zone d'impression.
La taille, le style et la position des reprères dépendent de l'agent utilisateur.
13.2.4 Les pages de gauche, de droite et de couverture
Pour une impression en recto verso, les boîtes de page de gauche et de droite devraient apparaître différemment.
Ceci peut être réalisé à l'aide de deux pseudo−classes CSS, pouvant être définies dans le contexte de la page.
Les agents utilisateurs rangent automatiquement chacune des pages selon les pseudo−classes :left ou :right.
Exemple(s) :
@page :left { margin−left: 4cm;
margin−right: 3cm;
}
@page :right { margin−left: 3cm;
margin−right: 4cm;
}
Quand on donne des déclarations distinctes aux pages de gauche et de droite, l'agent utilisateur doit respecter celles−ci, même si celui−ci n'effectue pas le transfert des boîtes de page selon les feuilles de gauche et celles de droite (ex. l'imprimante n'imprime qu'en recto).
Les auteurs peuvent également spécifier un style particulier à la première page d'un document avec la pseudo−classe :first :
Exemple(s) :
@page { margin: 2cm } /* Toutes les marges font 2cm */
@page :first {
margin−top: 10cm /* La marge du haut de la première page fait 10cm */
}
La détermination du côté de la première page d'un document, page de gauche ou de droite, dépend du sens d'écriture principal du document, ceci n'est pas traité dans la présente spécification. Cependant, pour forcer la première page à gauche, ou à droite, les auteurs peuvent insérer une coupure de page avant la première boîte générée (ex. en HTML, le faire pour élément BODY).
Les propriétés spécifiés dans une règle @page, avec une pseudo−classe :left ou :right, surclassent celles dans une règle @page qui en est dépourvue. Et celles dans une règle @page, avec une pseudo−classe :first, surclassent à leur tour celles avec une pseudo−classe :left ou :right.
Note : Le fait d'ajouter des déclarations aux pseudo−classes :left ou :right ne présage en rien d'une sortie d'impression du document en recto ou en recto verso (ceci étant en dehors de l'objet de cette spécification).
Note : Des versions ultérieures de CSS pourraient introduire d'autres pseudo−classes de page.
13.2.5 Le contenu en dehors de la boîte de page
Lors de la mise en forme d'un contenu dans le modèle de la page, une partie de celui−ci peut se trouver en dehors de la boîte de la page. Par exemple, un élément dont la propriété 'white−space' a la valeur 'pre' peut générer une boîte plus grande que celle de la page. De même, les boîtes en position absolue peuvent finir à des emplacements
"inattendus". Par exemple, des images peuvent être placées au bord de la boîte de la page, ou encore 100 000 pouces en dessous de celle−ci.
La définition de la mise en forme pour de tels éléments n'est pas abordée dans cette spécification. Cependant, dans ces cas, on recommande, de la part des auteurs et des agents utilisateurs, de suivre les principes généraux suivants :
Le contenu devrait être placé légèrement au−delà des limites de la boîte de la page pour permettre aux pages de "fuir" ;
•
Les agents utilisateurs devraient éviter de générer un grand nombre de boîtes de page vides pour respecter le positionnement des éléments (ex. il n'est pas souhaitable de produire 100 pages blanches à
l'impression). Noter, cependant, qu'il peut être nécessaire d'en générer un petit nombre pour honorer les valeurs 'left' et 'right' des propriétés 'page−break−before' et 'page−break−after' ;
•
Les auteurs ne devraient pas positionner d'éléments à des emplacements embarassants, juste pour éviter leur rendu. Il est préférable :
Pour supprimer complètement la génération d'une boîte, de donner la valeur 'none' à la propriété 'display' ;
♦
Pour rendre une boîte invisible, d'employer la propriété 'visibility'.
♦
•
Les agents utilisateurs peuvent gérer les boîtes positionnées en dehors de la boîte de la page de plusieurs façons, dont le rejet de celles−ci, ou la création pour celles−ci d'une autre boîte de page à la fin du document.
•