files/fr/web/css/@page/bleed/index.html


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

---
title: bleed
slug: Web/CSS/@page/bleed
tags:
  - CSS
  - Descripteur
  - Experimental
  - Reference
translation_of: Web/CSS/@page/bleed
---
<div>{{CSSRef}}{{SeeCompatTable}}</div>

<p>Le descripteur <strong><code>bleed</code></strong>, associé à la règle @ {{cssxref("@page")}}, définit l'espace duquel le contenu peut dépasser de la boîte de la page. Ce descripteur aura un effet uniquement si le descripteur {{cssxref("@page/marks","marks")}} est utilisé pour afficher les marques de coupure.</p>

<h2 id="Syntaxe">Syntaxe</h2>

<pre class="brush:css">/* Valeurs avec un mot-clé */
bleed: auto;

/* Valeurs de longueur */
/* Type &lt;length&gt;       */
bleed: 8pt;
bleed: 1cm;
</pre>

<h3 id="Valeurs">Valeurs</h3>

<dl>
 <dt><code>auto</code></dt>
 <dd>Cette valeur correspond à <code>6pt</code> si {{cssxref("marks")}} vaut <code>crop</code>. Dans les autres cas, cette valeur vaut zéro.</dd>
 <dt>{{cssxref("&lt;length&gt;")}}</dt>
 <dd>Cette valeur indique la distance, dans chaque direction, de laquelle le contenu peut dépasser de la boîte de la page. Les valeurs négatives sont autorisées mais les différentes implémentations fixent différentes limites.</dd>
</dl>

<h3 id="Syntaxe_formelle">Syntaxe formelle</h3>

<pre class="syntaxbox">{{csssyntax}}</pre>

<h2 id="Exemples">Exemples</h2>

<pre class="brush: css">@page {
  bleed: 1cm;
  marks: crop;
}
</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", "#bleed", "bleed")}}</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>

<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une <em>pull request</em>.</div>

<p>{{Compat("css.at-rules.page.bleed")}}</p>

<h2 id="Voir_aussi">Voir aussi</h2>

<ul>
 <li>{{cssxref("@page/marks", "marks")}}</li>
 <li>{{cssxref("@page/size", "size")}}</li>
</ul>