CSS と HTML を使用して印刷可能なドキュメントにページ番号を追加するにはどうすればよいですか?

印刷可能なドキュメントに CSS と HTML を使用してページ番号を付ける

Web ページを印刷するには、多くの場合、ヘッダー、フッター、ページネーションなどの追加要素が必要になります。プロフェッショナルなプレゼンテーション。フッター内にページ番号を含める必要がある場合は、CSS と HTML を使用した解決策を次に示します。

CSS ページ プロパティの利用:

CSS @page ルールには次のようなものがあります。ページ上の印刷要素を広範囲に制御します。フッターにページ番号を追加するには、「@bottom-right」マージンを使用して表示するコンテンツを指定できます:

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

このスニペットでは:

• counter( page) は現在のページ番号を表します。
• counter(pages) は合計ページ数を表します。

これらのカウンタを組み合わせることで、フッターのコンテンツに現在のページ番号と総ページ数が表示されます。

ブラウザの互換性と考慮事項:

@page プロパティは、すべての主要な最新ブラウザーでサポートされています。ただし、古いバージョンではこれらの機能が完全には実装されていない可能性があることに注意することが重要です。回答に記載されているリンクは、CSS ページに関する追加のリソースと洞察を提供します。番号付け:

• 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/

以上がCSS と HTML を使用して印刷可能なドキュメントにページ番号を追加するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。