Firefoxเป็นเบราว์เซอร์ยอดนิยมสำหรับWindows PC ^{(Windows PC)}แถบเครื่องมือสำหรับ นักพัฒนาซอฟต์แวร์^{(Developer Toolbar)}ในFirefoxและChromeช่วยให้คุณสามารถจับภาพหน้าจอของหน้าต่างเบราว์เซอร์ได้โดยไม่ต้องใช้โปรแกรมเสริมของเบราว์เซอร์หรือซอฟต์แวร์จับภาพหน้าจอ^{(screen capture software)}ของ บุคคลที่สาม บทแนะนำนี้จะแสดงวิธีการจับภาพหน้าจอในเบราว์เซอร์ Chrome หรือ Firefox^{(capture screenshots in Chrome or Firefox browser)}โดยไม่ต้องใช้หรือติดตั้งซอฟต์แวร์ของบุคคลที่สาม

คุณทราบดีว่าสำหรับการจับภาพหน้าจอเดสก์ท็อปบน Windows^{(capturing Desktop screenshots on Windows)}คุณต้องกดปุ่มPrint ScreenหรือPrnt^{(Prnt Scrn)} Scrn สามารถพบได้ในส่วนบนขวาของแป้นพิมพ์ของคุณ ในการจับภาพเฉพาะหน้าต่างที่ใช้งานอยู่ ให้กดปุ่ม Alt^(Alt)ค้างไว้ ก่อนที่คุณจะกดปุ่มPrint Screen ^{(Print Screen)}ให้เราดูวิธีการทำโดยใช้เครื่องมือสำหรับนักพัฒนา^{(Developer Tools)} ใน ตัว

จับภาพหน้าจอ^{(Screenshots)}ในเบราว์เซอร์Chrome

การจับภาพหน้าจอมีประโยชน์อย่างมากในกรณีที่คุณพบบทช่วยสอนออนไลน์ที่น่าสนใจ และต้องการบันทึกสำเนาของหน้าเว็บเป็นภาพหน้าจอบนคอมพิวเตอร์ของคุณเพื่อใช้อ้างอิงในภายหลัง หากคุณต้องการทำเช่นเดียวกัน ให้ทำตามขั้นตอนที่ระบุไว้ในโพสต์ด้านล่างเพื่อช่วยคุณถ่ายภาพหน้าจอแบบเต็มหน้าของหน้าเว็บใดๆ ในGoogle Chrome^{(Google Chrome)}

ขั้นแรก เปิดGoogle Chromeและไปที่หน้าเว็บที่คุณต้องการจับภาพหน้าจอ

ให้คลิกไอคอนแฮมเบอร์เกอร์ของเบราว์เซอร์ ซึ่งปรากฏอยู่ที่มุมขวาบนของหน้าจอคอมพิวเตอร์ของคุณ

ถัดไป เลือก ' เครื่องมือเพิ่มเติม^{(More tools)} ' เมื่อเมนูการทำงานขยาย และหลังจากนั้น ให้เลือกตัวเลือก ' เครื่องมือสำหรับนักพัฒนา^{(Developer tools)} '

หลังจากนั้น หน้าต่างเล็ก ๆ สำหรับเครื่องมือสำหรับนักพัฒนา^{(Developer Tools)}จะปรากฏขึ้น คลิก^(Click)ที่ ปุ่ม สลับโหมดอุปกรณ์^{(Toggle Device Mode)}ตามที่แสดงในภาพด้านล่างเพื่อเปิดใช้งานตัวเลือก เมื่อเปิดใช้งาน ปุ่มจะเปลี่ยนเป็นสีน้ำเงิน

ที่นี่ ย่อขนาด หน้าต่าง เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์^{(Developer Tools)}และตั้งค่าภาพหน้าจอของคุณในฉากหลัง นอกจากนี้ เลือกประเภทอุปกรณ์ที่เหมาะสมสำหรับภาพหน้าจอของคุณจากเมนูแบบเลื่อนลงของอุปกรณ์

หากจำเป็น ให้กำหนดค่าขนาดและการวางแนวของภาพหน้าจอ

เมื่อเสร็จแล้ว ให้คลิกที่ไอคอน 3 จุด ที่มุมขวาสุด และจากรายการตัวเลือกที่แสดง ให้เลือกหนึ่งการอ่านเป็น ' จับภาพหน้าจอ^{(Capture screenshot)} '

That’s it!

จับภาพหน้าจอในเบราว์เซอร์ Firefox

เคล็ดลับ^(TIP) : ตอนนี้คุณสามารถ เปิดใช้งาน คุณลักษณะหน้าจอของ Firefox ได้แล้ว^{(enable the Firefox Screenshots)}

เปิด เบราว์เซอร์ Mozilla Firefoxและไปที่หน้าเว็บที่มีหน้าจอที่คุณต้องการจับภาพ เมื่อถึงที่นั่นแล้ว ให้คลิก ไอคอนการ ดำเนินการเพิ่มเติม^{(More Actions)}ที่มุมขวาบน

เลือกไท^{(Developer Tile)}ล์ นักพัฒนา ซึ่งจะเปิดเครื่องมือสำหรับนักพัฒนาเว็บขึ้นมา หรือคุณสามารถกด ' Ctrl+Shift+I ' เพื่อเปิดเครื่องมือสำหรับนักพัฒนา

ถัดไป จากรายการตัวเลือกที่แสดง เลือกหนึ่งการอ่านเป็น ' Responsive Design Mode '

หากจำเป็น คุณสามารถตั้งค่าขนาดและการวางแนวสำหรับภาพหน้าจอได้โดยกำหนดค่าชุดตัวเลือกที่ถูกต้อง เมื่อคุณพบทุกสิ่งแล้ว ให้กด ปุ่ม กล้อง^(Camera)เพื่อคว้าหน้าจอ

สุดท้าย บันทึกภาพหน้าจอที่จับภาพไปยังตำแหน่งที่ต้องการบนคอมพิวเตอร์ของคุณ

ภาพหน้าจอมีประโยชน์อย่างมากสำหรับ นักออกแบบ เว็บไซต์^(Web)ที่ใช้ภาพหน้าจอของเบราว์เซอร์เพื่อตรวจสอบความเข้ากันได้ของเบราว์เซอร์อย่างละเอียดในเว็บเบราว์เซอร์และระบบต่างๆ ไม่ว่าคุณจะมีวัตถุประสงค์อะไรก็ตาม คุณสามารถใช้ เบราว์เซอร์ ChromeหรือFirefoxในการจับภาพหน้าจอโดยใช้เครื่องมือสำหรับนักพัฒนาเหล่านี้

อ่านต่อไป^{(Read next)} : วิธีถ่ายภาพหน้าจอของเว็บไซต์จากระยะ^{(How to take screenshots of a website remotely)}ไกล

Capture or take Screenshots in Chrome or Firefox browser natively

Firefоx is a popular browser for Windows PC. The Developer Toolbаr in Firefоx and Chrome allows you to take screenshоts of the browser window without using аny browser аdd-ons or 3rd-party screen capture software. This tutorial will show you how to capture screenshots in Chrome or Firefox browser natively, without using or installing any third-party software.

You are of course aware that for capturing Desktop screenshots on Windows, you have press the Print Screen or Prnt Scrn key. It can be found in the upper right section of your keyboard. To capture only the active window, hold down the Alt key, before you press the Print Screen key. Let us see how to do it using the built-in Developer Tools.

Capture Screenshots in Chrome browser

Screen Captures can be immensely useful in cases where you come across an interesting tutorial online and would want to save a copy of the web page as a screenshot on your computer for reference, later. If you want to do the same, follow the steps outlined in the post below to help you take full-page screenshot of any web page in Google Chrome.

First, launch Google Chrome and navigate to the web page whose screen you would like to capture.

Once there, click the hamburger icon of the browser, visible in the upper right-hand corner of your computer screen.

Next, chose ‘More tools’ when the menu of action expands and later, select ‘Developer tools’ options.

Thereafter, a small window for Developer Tools will show up. Click on the Toggle Device Mode button as shown in the image below to activate the option. Once activated, the button will turn blue in color.

Here, minimize the Developer Tools window and in the backdrop set up your screenshot. Also, select the right device type for your screenshot from the device drop-down menu.

If required, configure the size and orientation of the screenshot.

Once finished, click on the 3-dots icon in the extreme right corner, and from the list of options displayed, select the one reading as ‘Capture screenshot’.

That’s it!

Take Screenshots in Firefox Browser

TIP: You can now enable the Firefox Screenshots feature.

Open the Mozilla Firefox browser and go to the web page whose screen you would like to capture. Once there, click on More Actions icon visible in the upper right-hand corner.

Choose the Developer Tile. This will open the web developer tools. Alternatively, you can press ‘Ctrl+Shift+I’ to launch the developer tools.

Next, from the list of options displayed, select the one reading as ‘Responsive Design Mode’.

Here, if required, you can set up the size and orientation for your screenshot by configuring the correct set of options. Once you find all things in place, hit the Camera button to grab the screen.

Finally, save the captured screenshot to the desired location on your computer.

Screenshots can be of immense use to Web designers who take browser screenshots for performing a thorough checking of browser compatibility in different web browsers and systems. Whatever the purposes maybe you can always rely on Chrome or Firefox browser to take a screenshot natively, using these developer tools.

Read next: How to take screenshots of a website remotely.

Related posts

• วิธีล้าง Cache, Cookies, Browsing History ใน Chrome and Firefox

• Chrome or Firefox ไม่สามารถดาวน์โหลดหรือบันทึกไฟล์บนคอมพิวเตอร์ของคุณ

• ปิดการใช้งานถอนการติดตั้ง Adobe Flash, Shockwave ใน Chrome, Firefox, Edge, IE

• การแก้ไข: recaptcha ไม่ทำงานใน Chrome, Firefox หรือเบราว์เซอร์ใด ๆ

• การแก้ไข: Vimeo ไม่ทำงานใน Chrome or Firefox

• วิธีการเปลี่ยน Default Font ใน Chrome, Edge, Firefox browser

• วิธีทำ Flash work ใน Chrome, Edge, Firefox NOW

• Copy and Paste เป็นธรรมดา Text ใน Chrome, Firefox เบราว์เซอร์

• Force Links, Open in Background Tab ใน Chrome, Edge, Firefox, Opera

• วิธีการปิดการใช้งานหรือเปิดใช้งาน Caret Browsing ใน Chrome or Firefox

• Best Kodi addons & extensions สำหรับ Chrome & Firefox

• วิธีการคัดลอก URLs Open Open Tabs ใน Chrome and Firefox browser

• Google Chrome vs Firefox Quantum สำหรับ Windows 10

• วิธีการซ่อนไอคอน Browser Extension ใน Chrome, Edge or Firefox

• Share Button Plugins สำหรับ Share Button Plugins, Chrome, Firefox and Edge browsers

• Windows Defender Application Guard Extension สำหรับ Chrome & Firefox

• ไม่สามารถเปิดเว็บไซต์เฉพาะใน Chrome, Firefox, Edge, IE

• วิธีตั้งค่า Parental Control ใน Chrome, Edge, Firefox, Opera

• Always แสดง The Download button ใน Chrome, Firefox and Edge

• วิธีการเปิด News and Interests links ใน Chrome or Firefox; ไม่ใช่ Edge