Fungsi Page Break pada HTML untuk Print Preview

page break

Pada minggu kemarin saya memiliki masalah dalam melakukan pencetakan laporan dari aplikasi website yang saya bangun, Bagaimann caranya agar data yang saya cetak bisa dibagi perhalaman, setelah berselancar di internet saya menemukan solusi penggunaan Page Break sebagai css style pada html. saya baru tahu ada properti ini pada css. berikut ini contoh kode penggunaan Page Break.

<html>
<head>
<title>CSS - Page Break</title>
<body bgcolor="#ffffff">
<center>
Halaman 1
<div style="page-break-before:always;">
Halaman 2 </div>
<div style="page-break-after:always;">
Halaman 3 </div>
Gunakan print preview untuk melihat hasilnya
</center>
</body>
</html>

page-break-before berarti page break akan diaplikasikan sebelum tag div sehingga teks Halaman 2 akan berada pada halaman yang terpisah, sedangkan page-break-after berarti Page Break akan diaplikasikan setelah tag div sehingga tulisan “Gunakan print preview untuk melihat hasilnya” berada pada halaman tersendiri.
sumber:

W3Schools

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s