aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/css/@page/size/index.html
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 &lt;length&gt;           */
/* 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>&lt;length&gt;</code></dt>
 <dd>Une valeur de longueur (cf. {{cssxref("&lt;length&gt;")}}). 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>&lt;page-size&gt;</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>