---
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>
 <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>