Test 2: Paged Media & Pagination

ทดสอบการจัดการหน้ากระดาษ: ขนาด, margin, การเปลี่ยนหน้า, page-break-inside

Test 2.1 — Page Size & Margins

ข้อมูลหน้ากระดาษ:

กระดาษ A4 — 595.28 × 841.89 pt (210 × 297 mm)

Margin: 15mm ทุกด้าน = 42.52pt

พื้นที่ใช้งาน: 510.24 × 756.85 pt

กล่องเต็มความกว้าง (ต้องพอดีกับพื้นที่ใช้งาน):

กล่องนี้ต้อง เต็มความกว้าง ของพื้นที่เนื้อหา ไม่ล้นขอบหน้ากระดาษ

✓ ขนาดกระดาษ A4 ถูกต้อง, เนื้อหาอยู่ภายใน margin, กล่องไม่ล้นขอบ

Test 2.2 — Page Breaks (บังคับขึ้นหน้าใหม่)

เนื้อหาก่อนจุดเปลี่ยนหน้า — ข้อความนี้อยู่หน้าที่ 1

✓ หน้า 1 — กล่องสีเขียวนี้ต้องอยู่หน้าแรก

Test 2.2 (ต่อ) — หลัง page-break

✓ หน้า 2 — กล่องสีเหลืองนี้ต้องอยู่หน้าที่ 2

เนื้อหาหลังจุดเปลี่ยนหน้า ข้อความนี้ต้องอยู่หน้า 2

✓ page-break-before: always ต้องดีดเนื้อหาไปหน้าถัดไป

Test 2.3 — page-break-inside: avoid

สร้าง Card หลายใบ — Card ที่คาบเส้นหน้าต้องถูกดันไปหน้าถัดไปทั้งใบ:

Card #1

เนื้อหาในการ์ดใบที่ 1 ทดสอบว่าการ์ดทั้งใบจะถูกเก็บไว้ด้วยกัน

บรรทัดที่ 2 ของการ์ด

บรรทัดที่ 3 ของการ์ด

Card #2

เนื้อหาในการ์ดใบที่ 2 ทดสอบว่าการ์ดทั้งใบจะถูกเก็บไว้ด้วยกัน

บรรทัดที่ 2 ของการ์ด

บรรทัดที่ 3 ของการ์ด

Card #3

เนื้อหาในการ์ดใบที่ 3 ทดสอบว่าการ์ดทั้งใบจะถูกเก็บไว้ด้วยกัน

บรรทัดที่ 2 ของการ์ด

บรรทัดที่ 3 ของการ์ด

Card #4

เนื้อหาในการ์ดใบที่ 4 ทดสอบว่าการ์ดทั้งใบจะถูกเก็บไว้ด้วยกัน

บรรทัดที่ 2 ของการ์ด

บรรทัดที่ 3 ของการ์ด

✓ page-break-inside: avoid ทำงานแล้ว — Card ที่คร่อมขอบหน้าจะถูกเลื่อนไปหน้าถัดไป

Test 2.4 — Orphans & Widows

พารากราฟยาวที่ข้ามหน้า:

ย่อหน้านี้มีเนื้อหาจำนวนมากเพื่อให้ข้อความบางส่วนข้ามไปอยู่หน้าถัดไป ระบบ orphans และ widows จะควบคุมไม่ให้มีเพียงหนึ่งหรือสองบรรทัดหลงอยู่ที่ด้านบนหรือด้านล่างสุดของหน้ากระดาษเพียงลำพัง ซึ่งเป็นสิ่งสำคัญสำหรับเอกสารที่ต้องการคุณภาพระดับจัดพิมพ์ หลักการนี้มาจากวงการการพิมพ์แบบดั้งเดิมที่ให้ความสำคัญกับความสวยงามของหน้ากระดาษ เพราะบรรทัดที่หลุดไปอยู่คนเดียวจะทำให้ผู้อ่านเสียอรรถรส และเอกสารดูไม่เป็นมืออาชีพ

ย่อหน้าที่สองนี้ก็เช่นกัน เป้าหมายคือเนื้อหาต้องข้ามหน้าโดยมีอย่างน้อย 3 บรรทัดที่ค้างอยู่หน้าเดิม (orphans) และอย่างน้อย 3 บรรทัดที่ขึ้นหน้าใหม่ (widows) ไม่ใช่มีเพียงบรรทัดเดียวหลงอยู่

✓ orphans/widows ทำงานแล้ว — ควบคุมจำนวนบรรทัดขั้นต่ำก่อน/หลังหน้ากระดาษ