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

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

Barbara Streisand
Libérer: 2024-12-14 01:36:10
original
580 Les gens l'ont consulté

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

Sauts de page dans l'impression de Google Chrome

Lors de l'impression de pages Web dans Google Chrome, il peut être nécessaire de forcer des sauts de page à des points spécifiques de le document. Tandis que la propriété CSS page-break-after: toujours; est généralement recommandé, les utilisateurs rencontrent souvent des difficultés à l'implémenter dans Chrome.

Pour forcer efficacement les sauts de page dans l'impression Chrome, envisagez l'approche suivante :

<!DOCTYPE html>

<html>
  <head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <title>Paginated HTML</title>
    <style type="text/css" media="print">
      div.page {
        page-break-after: always;
        page-break-inside: avoid;
      }
    </style>
  </head>
  <body>
    <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>
  </body>
</html>
Copier après la connexion

Dans cet exemple, chaque page est encapsulée dans un

élément affecté à la classe « page ». La requête multimédia CSS cible le contexte d'impression et spécifie que les éléments avec la classe « page » doivent avoir un saut de page après eux. De plus, le page-break-inside: évitez; Cette règle empêche tout contenu de la page de s'étendre sur plusieurs pages imprimées.

En mettant en œuvre cette approche, vous pouvez garantir que les sauts de page se produisent aux endroits souhaités dans vos documents imprimés lorsque vous utilisez Google Chrome.

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal