Comment réparer les coupures d'impression A4 dans Chrome à l'aide de CSS ?

CSS pour définir le format de papier A4 pour une impression précise

Problème :

Définition de la taille de l'élément HTML aux dimensions A4 (21 cm x 29,7 cm) entraîne une coupure de page lors de l'impression dans Chrome, malgré un affichage correct dans le navigateur fenêtre.

Analyse :

Chrome semble spécifiquement avoir un problème avec l'attribution de « initiale » à la largeur de la page dans la règle des supports d'impression. Cela entraîne une mise à l'échelle du contenu à une taille légèrement supérieure aux dimensions A4 définies, ce qui entraîne un écrêtage.

Solution :

Pour résoudre ce problème, évitez d'utiliser 'initial ' pour la largeur de page dans la règle du support d'impression. Au lieu de cela, attribuez explicitement les dimensions A4 au HTML, au corps ou directement à l'élément « .page ».

@page {
  size: A4;
  margin: 0;
}
@media print {
  html, body {
    width: 210mm;
    height: 297mm;
  }
}

En définissant des dimensions fixes, le contenu reste dans les limites A4, empêchant ainsi le découpage. Cela résout le problème dans Chrome tout en préservant le reste des styles CSS.

Remarque : Cette modification résout le problème spécifique lié à la gestion par Chrome de « initiale » pour la largeur de la page. Cependant, il est important de tester la fonctionnalité d'impression sur différents navigateurs pour garantir la cohérence et l'exactitude de la sortie imprimée.

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!