Firefox是适用于Windows PC的流行浏览器。Firefox和Chrome中的开发者工具栏^{(Developer Toolbar)}允许您在不使用任何浏览器插件或第三方截屏软件^{(screen capture software)}的情况下截取浏览器窗口的屏幕截图。本教程将向您展示如何在 Chrome 或 Firefox 浏览器中^{(capture screenshots in Chrome or Firefox browser)}本地捕获屏幕截图，而无需使用或安装任何第三方软件。

您当然知道要在 Windows 上捕获桌面屏幕截图^{(capturing Desktop screenshots on Windows)}，您必须按Print Screen或Prnt Scrn键。它位于键盘的右上方。要仅捕获活动窗口，请按住Alt键，然后按Print Screen键。让我们看看如何使用内置的开发者工具^{(Developer Tools)}来做到这一点。

在Chrome浏览^(Chrome)器中截屏^{(Screenshots)}

如果您在网上遇到有趣的教程并希望将网页副本保存为计算机上的屏幕截图以供以后参考，则屏幕截图非常有用。如果您想这样做，请按照下面帖子中概述的步骤来帮助您在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。这将打开 Web 开发人员工具。或者，您可以按“ Ctrl+Shift+I ”启动开发者工具。

接下来，从显示的选项列表中，选择一个读数为“响应式设计模式^{(Responsive Design Mode)}”。

在这里，如果需要，您可以通过配置正确的选项集来设置屏幕截图的大小和方向。一旦你找到所有的东西，点击相机^(Camera)按钮来抓取屏幕。

最后，将捕获的屏幕截图保存到计算机上所需的位置。

截屏对网页^(Web)设计者来说非常有用，他们截取浏览器截屏以对不同 Web 浏览器和系统中的浏览器兼容性进行彻底检查。无论出于何种目的，您都可以使用这些开发人员工具，始终依靠Chrome或Firefox浏览器来原生地截取屏幕截图。^(Firefox)

阅读下一篇^{(Read next)}：如何远程截取网站的屏幕截图^{(How to take screenshots of a website remotely)}。

Capture or take Screenshots in Chrome or Firefox browser natively

Firefox is a popular browser for Windows PC. The Developer Τoolbar in Firefоx and Chrome allows you to take screenshotѕ of the browser window without using anу browser add-ons or 3rd-partу 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中，即

• FIX：Recaptcha不在Chrome，Firefox或任何浏览器中工作

• FIX：Vimeo不在Chrome or Firefox工作

• Restart Chrome，Edge or Firefox在Windows 11/10中没有输出标签

• 如何在Chrome，Firefox and Edge中翻译Web page

• Hyperlink Auditing在Chrome & Firefox browsers

• 什么是Lazy Loading？在Chrome，Firefox，Edge中启用或禁用它

• 400 Bad Request，Cookie Too Large - Chrome，Edge，Firefox，即

• Browser在Chrome and Firefox中采取Screenshot的扩展

• 它是安全的保存密码在Chrome，Firefox or Edge browser？

• 如何在Full Screen mode开设Chrome，Edge or Firefox browser

• 如何在Firefox or Chrome中使用多个Download文件夹

• 如何在Chrome，Edge，Firefox，Opera中设置Parental Control

• Chrome or Firefox地址bar search不起作用

• 免费Web Cache Viewer用于Chrome，Firefox and Edge browsers

• 无法在Chrome and Firefox browsers中键入文本输入字段

• 如何在Chrome or Firefox中禁用Hardware Acceleration

• 适用于 Chrome 和 Firefox 的最佳 Kodi 插件和扩展