จดไว้เดี๋ยวลืม
ความต้องการคือ สั่งพิมพ์จากหน้าเวบ แล้วให้มันแบ่งหน้าให้ตรงจุดที่เราต้องการให้ขึ้นหน้าใหม่
คุ้นๆ ว่า CSS มันมีพร็อพเพอตี้ตัวนึง เลยไปหาดูใน W3C
แล้วก็เจอตัวอย่าง เค้าใช้แบบนี้
ในแท็ก style ก็สร้างคลาสสำหรับ div ขั้นมาคลาสนึง
สมมุติตั้งว่า pageBreak ก็จะเป็นแบบนี้
<style>
div.pageBreak { page-break-before: always; }
</style>
เวลาจะใช้ ก็ใส่แท็ก div ตรงที่จะให้ขึ้นหน้าใหม่เวลาสั่งพิมพ์
<div class="pageBreak"></div>
ง่ายๆ แค่นี้แหละ
ลองทดสอบดู
<html><head>
<style>
div.pageBreak { page-break-before: always; }
</style>
</head>
<body>
xxxxx
<div class="pageBreak"></div>
yyyyy
<div class="pageBreak"></div>
zzzzz
</body>
</html>
เรียบร้อย…เปิดดูแล้วกด Print Preview…x, y, z พิมพ์แยกกัน 3 หน้าถูกต้อง
ที่จริงในตัวอย่างเค้าเขียนแท็ก div แบบนี้
<div class="pageBreak" />
ซึ่งปรากฏว่าบน IE มันแสดงผลถูกจริง แต่พอใช้ Firefox แล้วเจ๊ง
y กับ z มันอยู่หน้าเดียวกันเฉยไม่ยอมแยก ก็เลยต้องเขียน <div></div> อย่างที่เห็น
เพื่อให้ใช้ได้ทั้งสองบราวเซอร์หลักๆ นี่ก่อน
(ดูเหมือนจิ้งจอกไฟยังไม่ซัพพอร์ตการย่อปิดแท็กที่ควรมีอิลิเมนท์
เลยเขียนแบบในตัวอย่างไม่ได้)
วันนี้เอาแค่นี้ก่อน ^_^