Cette page a été traduite à partir de l'anglais par la communauté.Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
page-break-inside
Attention :Cette propriété a été remplacée par la propriétébreak-inside.
La propriétépage-break-inside ajuste la façon dont sont appliqués les sauts de page au sein de l'élément courant.
css
/* Valeurs avec un mot-clé */page-break-inside: auto;page-break-inside: avoid;/* Valeurs globales */page-break-inside: inherit;page-break-inside: initial;page-break-inside: unset;Syntaxe
Valeurs
Définition formelle
| Valeur initiale | auto |
|---|---|
| Applicabilité | les éléments de bloc dans le flux normal de l'élément racine. Les agents utilisateurs peuvent également l'appliquer sur d'autres éléments commetable-row. |
| Héritée | non |
| Valeur calculée | comme défini |
| Type d'animation | discrète |
Syntaxe formelle
page-break-inside =
avoid|
auto|
inherit
Alias avecbreak-inside
La propriétépage-break-inside a désormais été remplacée par la propriétébreak-inside.
Pour des raisons de compatibilité,page-break-inside devrait être considérée par les navigateurs comme synonyme debreak-inside. De cette façon, les sites utilisantpage-break-inside pourront continuer de fonctionner. Voici un sous-ensemble des valeurs de cette propriété et des correspondances
page-break-inside | break-inside |
|---|---|
auto | auto |
avoid | avoid |
Exemples
HTML
html
<div> <p>Un premier paragraphe.</p> <section> <span>Une liste</span> <ol> <li>Un</li> <!-- <li>Deux</li> --> </ol> </section> <ul> <li>Un</li> <!-- <li>Deux</li> --> </ul> <p>Un deuxième paragraphe.</p> <p>Un troisième paragraphe, un peu plus long.</p> <p> Un quatrième paragraphe, un peu plus long voire plus long que le troisième. </p></div>CSS
css
.page { background-color: #8cffa0; height: 90px; width: 200px; columns: 1; column-width: 100px;}.list,ol,ul,p { break-inside: avoid;}p { background-color: #8ca0ff;}ol,ul,.list { margin: 0.5em 0; display: block; background-color: orange;}p:first-child { margin-top: 0;}Résultat
Spécifications
| Specification |
|---|
| CSS Fragmentation Module Level 3 # page-break-properties |