ホームページ >ウェブフロントエンド >CSSチュートリアル >CSS を使用して各印刷ページで表のヘッダーを繰り返すにはどうすればよいですか?

CSS を使用して各印刷ページで表のヘッダーを繰り返すにはどうすればよいですか?

Barbara Streisand
Barbara Streisandオリジナル
2024-12-03 17:22:11535ブラウズ

How Can I Repeat Table Headers on Each Printed Page Using CSS?

CSS を使用して印刷モードでテーブル ヘッダーを繰り返す

テーブル ヘッダー () が毎回繰り返されるようにすることができます。 CSS を使用して表が複数のページにまたがる場合は、page を使用します。これは、THEAD 要素を利用することで実現できます。

THEAD 要素はテーブルのヘッダーを表し、通常は

内で定義されます。要素。 THEAD 要素を使用すると、テーブルのヘッダー行をグループ化し、印刷ドキュメントのすべてのページでそれらの行を繰り返すように指定できます。

@page {
  thead { display: table-header-group; }
}

この CSS ルールは、thead 要素の表示プロパティを table-header-group に設定します。 thead が table-header-group に設定されている場合、ブラウザは印刷ドキュメントの各ページでテーブル ヘッダー行が繰り返されるようにします。

Reference

Refer THEAD 要素の詳細については、公式ドキュメントを参照してください。 [https://developer.mozilla.org/en-US/docs/Web/HTML/Element/thead](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/thead)

以上がCSS を使用して各印刷ページで表のヘッダーを繰り返すにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。