blob: 89d4723b4d27abfcdbf70b2c91b226ad29f720c6 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
|
---
title: size
slug: Web/CSS/@page/size
tags:
- CSS
- Descripteur
- Experimental
- Reference
translation_of: Web/CSS/@page/size
---
<div>{{CSSRef}}{{SeeCompatTable}}</div>
<p>Le descripteur <strong><code>size</code></strong>, associé à la règle @ {{cssxref("@page")}}, permet de définir les dimensions et l'orientation de la boîte utilisée pour représenter une page. La plupart du temps, cette taille correspondra à la totalité de la taille de la page imprimée.</p>
<p>Les dimensions de cette boîte peuvent être définies de façon absolues ou relatives (dans ce cas, la page occupera l'espace disponible).</p>
<h2 id="Syntaxe">Syntaxe</h2>
<pre class="brush:css">/* Des mots-clés qui peuvent être utilisées
pour remplir l'espace disponible */
size: auto;
size: portrait;
size: landscape;
/* Des valeurs de longueur */
/* Type <length> */
/* 1 valeur : hauteur = largeur */
size: 6in;
/* 2 valeurs : la largeur puis la hauteur */
size: 4in 6in;
/* Des mots-clés qui représentent des */
/* dimensions absolues */
size: A4;
size: B5;
size: JIS-B4;
size: letter;
/* Une déclaration incluant la taille et l'orientation */
size: A4 portrait;
</pre>
<h3 id="Valeurs">Valeurs</h3>
<dl>
<dt><code>auto</code></dt>
<dd>L'agent utilisateur décidera de la taille de page. En général, ce seront les dimensions de la page cible (celle sur laquelle imprimer/afficher) qui seront utilisées.</dd>
<dt><code>landscape</code></dt>
<dd>Le contenu de la page est affiché en paysage (le côté le plus long de la page sera le côté horizontal).</dd>
<dt><code>portrait</code></dt>
<dd>Le contenu de la page est affiché en portrait (le côté le plus long de la page sera le côté vertical).</dd>
<dt><code><length></code></dt>
<dd>Une valeur de longueur (cf. {{cssxref("<length>")}}). La première valeur utilisée correspond à la largeur de la boîte de la page et la deuxième correspond à la hauteur. Si une seule valeur est fournie, celle-ci sera utilisée pour la largeur et pour la hauteur.</dd>
<dt><code><page-size></code></dt>
<dd><p>Un mot-clé avec l'une des valeurs suivantes :</p>
<dl>
<dt><code>A5</code></dt>
<dd>Ce mot-clé correspond aux dimensions ISO standard : 148mm x 210mm.</dd>
<dt><code>A4</code></dt>
<dd>Ce mot-clé correspond aux dimensions ISO standard : 210mm x 297mm (c'est le format le plus utilisé pour les impressions occasionnelles sur les imprimantes personnelles).</dd>
<dt><code>A3</code></dt>
<dd>Ce mot-clé correspond aux dimensions ISO standard : 297mm x 420mm.</dd>
<dt><code>B5</code></dt>
<dd>Ce mot-clé correspond aux dimensions ISO standard : 176mm x 250mm.</dd>
<dt><code>B4</code></dt>
<dd>Ce mot-clé correspond aux dimensions ISO standard : 250mm x 353mm.</dd>
<dt><code>JIS-B5</code></dt>
<dd>Ce mot-clé correspond aux dimensions JIS standard : 182mm x 257mm.</dd>
<dt><code>JIS-B4</code></dt>
<dd>Ce mot-clé correspond aux dimensions JIS standard : 257mm x 364mm.</dd>
<dt><code>letter</code></dt>
<dd>Ce mot-clé correspond à la taille standard du papier à lettre aux États-Unis : 8.5in x 11in.</dd>
<dt><code>legal</code></dt>
<dd>Ce mot-clé correspond à la taille standard des documents légaux aux États-Unis : 8.5in par 14in.</dd>
<dt><code>ledger</code></dt>
<dd>Ce mot-clé correspond à la taille standard des pages d'un livre en grand format aux États-Unis. Cela correspond à : 11in x 17in.</dd>
</dl>
</dd>
</dl>
<h2 id="Exemples">Exemples</h2>
<pre class="brush: css">@page {
size: 4cm 6cm landscape;
}
</pre>
<pre class="brush: css">@media print {
@page {
size: 50mm 150mm;
}
}</pre>
<h2 id="Spécifications">Spécifications</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Spécification</th>
<th scope="col">État</th>
<th scope="col">Commentaires</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('CSS3 Paged Media', '#size', 'size')}}</td>
<td>{{Spec2('CSS3 Paged Media')}}</td>
<td>Définition initiale.</td>
</tr>
</tbody>
</table>
<p>{{cssinfo}}</p>
<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
<p>{{Compat("css.at-rules.page.size")}}</p>
<h2 id="Voir_aussi">Voir aussi</h2>
<ul>
<li>{{cssxref("@page/bleed", "bleed")}}</li>
<li>{{cssxref("@page/marks", "marks")}}</li>
</ul>
|