Comment puis-je ajouter des numéros de page aux pages Web imprimées à l'aide de CSS et HTML ?

Réaliser la numérotation des pages dans les pages Web imprimées à l'aide de CSS/HTML

Vous avez rencontré une exigence intéressante : ajouter des en-têtes de page, des pieds de page et des pages numéros sur une copie imprimée du site Web. Cet article explore des solutions pour vous aider dans cette démarche.

Utilisation de CSS et HTML pour la numérotation des pages

En CSS, la règle @page offre un contrôle étendu sur le formatage des pages, y compris les numéros de page. En définissant un compteur à l'intérieur de la règle @en bas à droite, vous pouvez afficher dynamiquement les numéros de page sur chaque page imprimée.

Voici un extrait de code simple :

@page {
  @bottom-right {
    content: counter(page) " of " counter(pages);
  }
}

Ce code placera la page numéro dans le coin inférieur droit de chaque page, au format "Page X sur Y".

Navigateur Support

La règle CSS @page est prise en charge par la plupart des navigateurs modernes. Si vous devez prendre en charge des navigateurs plus anciens, envisagez d'utiliser des techniques spécifiques au navigateur ou des bibliothèques tierces.

Lectures complémentaires

Pour plus d'informations sur la numérotation des pages en CSS et HTML , reportez-vous aux ressources suivantes :

• [Page CSS3 Module](http://www.w3.org/TR/css3-page/)
• [Utilisation de la propriété 'page' en CSS](http://www.intelligrape.com/blog/2010 /08/20/add-page-number-using-page-property-of-css/)
• [Numéros de pages avec PrinceXML](http://www.princexml.com/doc/6.0/page-numbers/)

La mise en œuvre de ces solutions vous permettra de créer des copies imprimées de sites Web avec des en-têtes de page, des pieds de page et des numéros de pages, améliorant la lisibilité et le professionnalisme de ces documents.

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!