Comment imprimer des en-têtes et des pieds de page personnalisés dans un rapport Web sans utiliser JavaScript ?

Impression d'en-têtes et de pieds de page personnalisés sur chaque page

Lors de la génération de rapports Web à imprimer, il peut être souhaitable d'inclure des en-têtes et des pieds de page personnalisés pieds de page sur chaque page. Cependant, il était initialement supposé que cette fonctionnalité n'était pas possible dans la fenêtre du navigateur.

Malgré des recherches antérieures, une solution possible a émergé grâce à l'utilisation de tableaux. En stylisant les éléments du tableau à l'aide de CSS, l'en-tête et le pied de page peuvent être positionnés respectivement à l'aide des balises thead et tfoot.

<table style="display: table">
  <thead style="display: table-header-group">
    <tr><td>Your header goes here</td></tr>
  </thead>
  <tfoot style="display: table-footer-group">
    <tr><td>Your footer goes here</td></tr>
  </tfoot>
  <tbody>
    <!-- Report body -->
  </tbody>
</table>

Pour garantir que l'en-tête et le pied de page ne sont visibles que sur les supports imprimés, les requêtes multimédias CSS peut être implémenté :

@media print {
  thead { display: table-header-group; }
  tfoot { display: table-footer-group; }
}
@media screen {
  thead { display: none; }
  tfoot { display: none; }
}

Initialement, cette solution devait fonctionner uniquement dans Firefox et Internet Explorer. Cependant, des mises à jour récentes ont étendu sa compatibilité à Chrome et Safari.

Cette approche basée sur des tableaux constitue une solution de contournement viable pour imprimer des en-têtes et des pieds de page personnalisés sur chaque page, même avec une prise en charge CSS limitée dans Internet Explorer 6.

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!