Numéros de page avec CSS/HTML

Question

Un cas d'utilisation intéressant est apparu pour nous, nous demandons que lorsque nous imprimons un site web, la copie imprimée aura un en-tête de page et un pied de page, et à l'intérieur du pied de page le numéro de page.

Quelqu'un a une idée de comment réaliser cela ?

Remarque : La version du navigateur peut être la dernière de n'importe quoi, les clients sont d'autres développeurs web.

Answer 1

En fonction du support du navigateur requis.

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

Lecture supplémentaire :

• http://www.w3.org/TR/css3-page/
• http://www.intelligrape.com/blog/2010/08/20/add-page-number-using-page-property-of-css/
• http://www.princexml.com/doc/6.0/page-numbers/

Answer 2

Il y a une page de test à http://www.princexml.com/howcome/2007/xtech/papers/output/0082-32/index.xhtml qui inclut le code de contenu @page dans son fichier css. Je n'ai pas réussi à le faire fonctionner dans les versions actuelles d'IE, Chrome ou Firefox.