印刷モードでのテーブル ヘッダーの繰り返し

印刷中にテーブルが複数のページにまたがる場合、多くの場合、ヘッダー行 (TH 要素) を含めることが望ましいです。 ) 簡単に参照できるように、各ページで繰り返されています。 CSS は、これを実現するメカニズムを提供します。

解決策: THEAD 要素の使用

CSS の THEAD 要素は、この目的のために特別に設計されています。これにより、印刷されるすべてのページで繰り返される一連のヘッダー行を定義できます。使用方法は次のとおりです:

1. テーブル ヘッダーを THEAD 要素でラップします:

   Header 1	Header 2	Header 3

2. 次のスタイルを @page ルールに追加します:

   @page {
     margin: 1cm;
     @top-left {
       content: element(thead);
     }
   }

説明:

• thead 要素はヘッダー行のコンテナとして機能します。
• @ページ ルールはページ マージンを設定し、コンテンツ プロパティが element(thead) に設定された @top-left サブルールを含みます。
• この構成ブラウザに、各印刷ページの左上隅に THEAD 要素の内容をレンダリングするよう指示し、表のヘッダーを効果的に繰り返します。

THEAD 要素を利用すると、表のヘッダーを確実に表示できます。各印刷ページに一貫して表示され、読者にとって明確で便利な参照情報となります。