>웹 프론트엔드 >CSS 튜토리얼 >CSS로 인쇄할 때 각 페이지에 표 머리글을 어떻게 반복할 수 있습니까?

CSS로 인쇄할 때 각 페이지에 표 머리글을 어떻게 반복할 수 있습니까?

Patricia Arquette
Patricia Arquette원래의
2024-12-07 15:35:15755검색

How Can I Repeat Table Headers on Each Page When Printing with CSS?

CSS 인쇄 모드에서 표 머리글 반복

질문:

CSS를 사용할 수 있습니까? 테이블이 여러 페이지에 걸쳐 있을 때 인쇄된 모든 페이지에서 테이블 헤더(th)가 반복되는지 확인하세요. 페이지?

답변:

예, THEAD 요소를 사용하면 가능합니다.

설명:

THEAD 요소는 이러한 목적을 위해 특별히 설계되었습니다. @page 속성과 함께 사용하면 표가 단일 페이지를 넘어서더라도 인쇄된 문서의 모든 페이지에서 표 헤더를 반복할 수 있습니다.

CSS 코드:

THEAD 요소를 사용하여 테이블 헤더를 반복하려면 다음 단계를 따르세요.

  1. 포함할 별도의 THEAD 요소를 만듭니다. 테이블 헤더(th).
  2. 테이블 헤더의 시작 행과 닫는 행 주위에 THEAD 요소를 배치합니다.
  3. CSS에서 @page 속성 내에 다음 코드를 추가합니다.
@page {
  @top-left {
    content: element(thead);
  }
}

이 코드는 테이블이 표시될 때 모든 페이지에서 THEAD 요소를 자동으로 반복하도록 브라우저에 지시합니다. 인쇄됩니다.

참조:

THEAD 요소와 인쇄 모드에서의 사용에 대한 자세한 내용은 다음 공식 문서를 참조하세요.

[ CSS THEAD 요소](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/thead)

위 내용은 CSS로 인쇄할 때 각 페이지에 표 머리글을 어떻게 반복할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.