[CSS] วิธีเช็คหน้าเว็บของเราตอน Print

บางครั้งในการทำเว็บไซต์ เราต้องเขียน CSS เพื่อใช้สำหรับในการ Print ซึ่งเราสามารถสั่งให้ Browser ใช้งาน CSS สำหรับการ Print โดยเฉพาะได้ตามด้านล่าง

หรือใช้ media ใน File CSS ของเรา

ทีนี้เราจะสามารถเช็คหน้าเว็บของเราเวลา Print ได้จาก Browser ที่เราใช้งาน

Chrome

เปิด DevTools หรือ Inspect (ใน Mac ให้กด Command + Option + i)

เลือกตามลำดับ หัวข้อ More tools => Rendering แล้วด้านล่างจะปรากฎกล่องดังรูป

ในส่วนของ Emulate CSS media ให้เปลี่ยนเป็น print ก็เสร็จแล้วครับ

Safari

เปิด DevTools หรือ Inspect (ใน Mac ให้กด Command + Option + i)

เลือกที่หัวข้อ Elements แล้วเลือกที่ Icon เหมือนรูป Printer เป็นอันเสร็จสิ้น

Firefox

เปิด DevTools หรือ Inspect (ใน Mac ให้กด Command + Option + i)

เลือกที่หัวข้อ Inspector และหา Icon ที่เหมือนเป็นรูป Icon เอกสารแล้วคลิก