인쇄할 때 HTML 테이블 행이 여러 페이지에 걸쳐 분할되는 것을 방지하려면 어떻게 해야 합니까?-CSS 튜토리얼-php.cn

집

웹 프론트엔드

CSS 튜토리얼

인쇄할 때 HTML 테이블 행이 여러 페이지에 걸쳐 분할되는 것을 방지하려면 어떻게 해야 합니까?

Dec 14, 2024 pm 10:56 PM

How Can I Prevent HTML Table Rows from Splitting Across Pages When Printing?

HTML 테이블 인쇄에서 페이지 나누기 처리

광범위한 HTML 테이블을 인쇄할 때 페이지 나누기를 관리하는 것은 가독성을 유지하는 데 중요합니다. 행이 여러 페이지에 걸쳐 분할되는 것을 방지하려면 다음 해결 방법을 살펴보십시오.

CSS 스타일을 사용하여 HTML 테이블에서 페이지 나누기를 제어할 수 있습니다.

table { page-break-inside:auto }
tr    { page-break-inside:avoid; page-break-after:auto }
thead { display:table-header-group }
tfoot { display:table-footer-group }

로그인 후 복사

다음은 이러한 내용이 포함된 HTML 테이블의 예입니다. 적용되는 CSS 스타일:

&lt;!DOCTYPE HTML&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=UTF-8&quot;&gt;
&lt;title&gt;Test&lt;/title&gt;
&lt;style type=&quot;text/css&quot;&gt;
    table { page-break-inside:auto }
    tr    { page-break-inside:avoid; page-break-after:auto }
    thead { display:table-header-group }
    tfoot { display:table-footer-group }
&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;table&gt;
        &lt;thead&gt;
            &lt;tr&gt;&lt;th&gt;heading&lt;/th&gt;&lt;/tr&gt;
        &lt;/thead&gt;
        &lt;tfoot&gt;
            &lt;tr&gt;&lt;td&gt;notes&lt;/td&gt;&lt;/tr&gt;
        &lt;/tfoot&gt;
        &lt;tbody&gt;
        &lt;tr&gt;
            &lt;td&gt;x&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td&gt;x&lt;/td&gt;
        &lt;/tr&gt;
        &lt;!-- 500 more rows --&gt;
        &lt;tr&gt;
            &lt;td&gt;x&lt;/td&gt;
        &lt;/tr&gt;
    &lt;/tbody&gt;
    &lt;/table&gt;
&lt;/body&gt;
&lt;/html&gt;

로그인 후 복사

이러한 CSS 규칙을 구현하면 다음이 보장됩니다. that:

tr 요소의 page-break-inside:avoid는 페이지 내에서 행 나누기를 방지합니다.
tr 요소의 page-break-after:auto는 각 행 뒤에 페이지 나누기를 허용합니다. 행이 분할되지 않도록 합니다.
ad 및 tfoot 요소의 display:table-header-group 및 display:table-footer-group은 테이블 헤더를 유지합니다. 및 각 페이지의 바닥글.

위 내용은 인쇄할 때 HTML 테이블 행이 여러 페이지에 걸쳐 분할되는 것을 방지하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명

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