วิธีตั้งค่าการแบ่งหน้าภายในองค์ประกอบ (page-break-inside) ด้วย JavaScript

คุณสมบัติ pageBreakInside ควบคุมการแบ่งหน้าภายในองค์ประกอบ ค่า auto (แบ่งได้ถ้าจำเป็น), avoid (พยายามไม่แบ่ง), inherit

หมายเหตุ: ผลลัพธ์จะเห็นได้เมื่อพิมพ์หรือดู Print Preview เท่านั้น

ตัวอย่าง

<!DOCTYPE html>
<html>
  <body>
    <h1>Heading 1</h1>
    <p>This is demo text.</p>
    <p>This is demo text.</p>
    <p id="myFooter">This if footer text.</p>
    <button type="button" onclick="display()"> Set page-break </button>
    <script>
      function display() {
        document.getElementById("myFooter").style.pageBreakInside = "auto";
      }
    </script>
  </body>
</html>