ต้องรู้
- เลือกจุดสามจุด เมนูเพิ่มเติม > เครื่องมือเพิ่มเติม > เครื่องมือสำหรับนักพัฒนา คลิกไอคอนจุดไข่ปลา > เรียกใช้คำสั่ง > พิมพ์ "ภาพหน้าจอ"
- เลือกประเภท: ภาพหน้าจอพื้นที่ ภาพหน้าจอขนาดเต็ม ภาพหน้าจอของโหนด หรือภาพหน้าจอ
บทความนี้อธิบายวิธีจับภาพหน้าจอบน Microsoft Edge โดยใช้ยูทิลิตี้ที่ซ่อนอยู่ซึ่งซ่อนอยู่ภายในเครื่องมือสำหรับนักพัฒนา
วิธีถ่ายภาพหน้าจอของหน้าเว็บบน Edge
ความสามารถในการจับภาพหน้าจอแบบเต็มหน้าของหน้าเว็บจากเบราว์เซอร์นั้นมีค่ามาก เนื่องจากซอฟต์แวร์จับภาพหน้าจอบางตัวไม่ได้ทำงานอย่างสมบูรณ์ด้วยเนื้อหาที่เลื่อนได้ คุณสามารถใช้เครื่องมือสำหรับนักพัฒนาใน Edge เพื่อจับภาพหน้าจอแบบเต็มหน้าและภาพหน้าจออื่นๆ อีกสามประเภท
เบราว์เซอร์จะบันทึกไฟล์รูปภาพในโฟลเดอร์ดาวน์โหลดเริ่มต้นบนคอมพิวเตอร์ของคุณ หรือจะแจ้งให้คุณระบุตำแหน่งเฉพาะ
-
กดปุ่ม F12 หรือ Ctrl + Shift + I บนแป้นพิมพ์ของคุณบน Windows เพื่อเปิด เครื่องมือสำหรับนักพัฒนา ใน Microsoft Edge ผู้ใช้ macOS ควรใช้แป้นพิมพ์ลัด Command + Option + I คุณยังสามารถเข้าถึงเครื่องมือสำหรับนักพัฒนาได้จากแถบเครื่องมือ Edge เลือกจุดสามจุด เพิ่มเติม > เครื่องมือเพิ่มเติม > เครื่องมือสำหรับนักพัฒนา
Image -
ในแผงเครื่องมือสำหรับนักพัฒนา ให้เลือกไอคอนจุดไข่ปลาสามจุดที่ด้านบนขวาเพื่อเปิด ปรับแต่งและควบคุม DevTools
Image - เลือก เรียกใช้คำสั่ง (หรือกด Ctrl + Shift + P) จากเมนูแนวตั้ง
-
พิมพ์ "ภาพหน้าจอ" ในแผงคำสั่งเรียกใช้เพื่อแสดงคำสั่งที่เป็นไปได้สี่คำสั่ง คำสั่งทั้งสี่นี้ช่วยคุณเลือกส่วนของหน้าเว็บที่คุณต้องการจับภาพ
Image -
เลือก จับภาพหน้าจอของพื้นที่ จากรายการคำสั่งเพื่อจับภาพหน้าจอของพื้นที่เฉพาะ ใช้เส้นเล็งเพื่อคลิกซ้ายแล้ววาดโครงร่างสำหรับภาพหน้าจอ (เราเน้นส่วนที่จะแสดงว่าเปลี่ยนเป็นสีเทาเข้ม แต่แน่นอนว่าคุณจะเน้นส่วนที่ต้องการ)
Image - เลือก จับภาพหน้าจอขนาดเต็ม จากรายการคำสั่งเพื่อถ่ายภาพหน้าจอขนาดเต็ม ซึ่งจะจับภาพหน้าเว็บทั้งหมด รวมทั้งเนื้อหาที่เลื่อนได้ซึ่งไม่อยู่บนหน้าจอ
-
Select จับภาพหน้าจอของโหนด จากรายการคำสั่งเพื่อจับภาพโหนด HTML ที่เลือกในเครื่องมือ Dev จากแท็บ Elementsคุณยังสามารถคลิกขวาที่โหนดที่เลือกและเลือก จับภาพหน้าจอโหนด ตัวอย่างเช่น เลือก "คลาสส่วนหัว" และจับส่วนหัวของหน้าเว็บ
Image - เลือก จับภาพหน้าจอ จากรายการคำสั่งเพื่อจับภาพหน้าจอของมุมมองที่ทำงานอยู่ นี่คือพื้นที่ที่มองเห็นได้ภายในเบราว์เซอร์และไม่รวมพื้นที่ที่เลื่อนได้แต่มองไม่เห็น
เคล็ดลับ:
เบราว์เซอร์ Chromium เช่น Chrome และ Edge ยังให้คุณจำลองอุปกรณ์อื่นๆ และความละเอียดของหน้าจอได้ คุณยังสามารถใช้คุณสมบัตินี้และคำสั่งภาพหน้าจอ และจับภาพว่าหน้าเว็บจะมีลักษณะอย่างไรบนอุปกรณ์เฉพาะ
เลือก สลับการจำลองอุปกรณ์ บนแถบเครื่องมือเครื่องมือสำหรับนักพัฒนา (หรือกด Ctrl + Shift + M)
