recherche

Maison >interface Web >tutoriel CSS >Comment puis-je forcer de manière fiable les sauts de page lors de l'impression à partir de Google Chrome ?

Comment puis-je forcer de manière fiable les sauts de page lors de l'impression à partir de Google Chrome ?

DDD
DDDoriginal
2024-12-10 21:17:17150parcourir

How Can I Reliably Force Page Breaks When Printing from Google Chrome?

Sauts de page dans l'impression Google Chrome

Dans Google Chrome, réaliser des sauts de page pendant l'impression peut être difficile. Malgré la documentation suggérant la validité de page-break-after: always;, cette méthode peut ne pas toujours fonctionner efficacement.

Solution

Pour forcer de manière fiable les sauts de page dans Chrome, l'approche suivante a fait ses preuves :

Créez un fichier

pour chaque page que vous souhaitez casser.

Attribuez la classe CSS "page" à chaque

.

Au sein de la requête média "print" de votre CSS, définissez les règles suivantes : 

div.page {
  page-break-after: always;
  page-break-inside: avoid;
}

Par exemple :

<div class="page">
  <h1>This is Page 1</h1>
</div>
<div class="page">
  <h1>This is Page 2</h1>
</div>
<div class="page">
  <h1>This is Page 3</h1>
</div>

En suivant cette approche, vous pouvez garantir des sauts de page cohérents lors de l'impression depuis Google Chrome, quelle que soit la taille ou la complexité du contenu.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

css chrome print define for break class this
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Que signifie la barre oblique (/) dans la notation abrégée des polices CSS ?Article suivant：Que signifie la barre oblique (/) dans la notation abrégée des polices CSS ?

Articles Liés

Voir plus