Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Menghalang Baris Jadual HTML daripada Berpecah Merentasi Halaman Semasa Mencetak?
Bagaimanakah Saya Boleh Menghalang Baris Jadual HTML daripada Berpecah Merentasi Halaman Semasa Mencetak?
- Patricia Arquetteasal
- 2024-12-14 22:56:14433semak imbas
Mengatasi Pecah Halaman dalam Pencetakan Jadual HTML
Apabila mencetak jadual HTML yang banyak, mengurus pemisah halaman adalah penting untuk mengekalkan kebolehbacaan. Untuk mengelakkan baris daripada terbahagi pada halaman, terokai penyelesaian berikut:
Anda boleh menggunakan gaya CSS untuk mengawal pemisah halaman dalam jadual HTML anda:
table { page-break-inside:auto }
tr { page-break-inside:avoid; page-break-after:auto }
thead { display:table-header-group }
tfoot { display:table-footer-group }
Berikut ialah contoh jadual HTML dengan ini Gaya CSS digunakan:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test</title>
<style type="text/css">
table { page-break-inside:auto }
tr { page-break-inside:avoid; page-break-after:auto }
thead { display:table-header-group }
tfoot { display:table-footer-group }
</style>
</head>
<body>
<table>
<thead>
<tr><th>heading</th></tr>
</thead>
<tfoot>
<tr><td>notes</td></tr>
</tfoot>
<tbody>
<tr>
<td>x</td>
</tr>
<tr>
<td>x</td>
</tr>
<!-- 500 more rows -->
<tr>
<td>x</td>
</tr>
</tbody>
</table>
</body>
</html>
Melaksanakan peraturan CSS ini memastikan bahawa:
- page-break-inside:elakkan pada elemen tr menghalang pemisah baris dalam halaman.
- page-break-after:auto pada elemen tr membenarkan pemisah halaman selepas setiap baris, memastikan ia tidak berpecah.
- paparan:kumpulan-pengepala-meja dan paparan:kumpulan-pengaki-meja pada iklan dan elemen tfoot mengekalkan pengepala dan pengaki jadual pada halaman masing-masing.
Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menghalang Baris Jadual HTML daripada Berpecah Merentasi Halaman Semasa Mencetak?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!