如何使用chrome浏览器自带的截图功能？

我们相信：世界是美好的，你是我也是。平行空间的世界里面，不同版本的生活也在继续...

本文讲述chrome浏览器自带的一个非常非常隐蔽的截图功能。对，这个功能非常非常隐蔽。功能是针对浏览器里面的网页进行操作的，所以，截图并不能处理浏览器外部的内容，或者严格的说，只是网页范围内的区域，连浏览器的菜单栏之类的区域，都是不能被截取的。

本文测试环境：mac、chrome@80.0.3987.149（正式版本）（64 位）。

隐藏的截图功能

首先，要打开chrome的开发者模式，这个就不多少了。mac下面的快捷键是：alt+win+i。
其次，聚焦到底部的开发者区域，再打开一个神秘的快捷命令输入模式。快捷键是：shift+win+p.
再次，在输入框里面，输入命令screen。就可以筛选出相关的截图命令了。

命令详解

值得注意的是：可操作区域就是网页body的区域哦，出了这个区域就无法操作了。
一共四个命令。特殊的就两个：网页全屏截图和节点dom截图。

• capture area screenshoot，常规的自定义截图。只不过可截图的范围被限定在网页的body区域。
• capture full size screenshoot，网页全屏截图，这个最常使用了。做个网页效果，用这个网页全屏截图，就不用滚动拼接了，非常棒。便于直接发效果图给客户。
• capture node screenshoot，节点截图，这个功能很厉害，可以根据左侧选择的dom，来精确的截图。这个功能有点新颖。
• capture screenshoot可视区域截图，就是最普通的截图，不处理滚动轴区域。

相关链接

关于截图这块的内容，苏南大叔说过很多方案，当然了，每个方案都有多多少少的缺陷。所以，大家辩证的看待这个问题吧。

• https://newsn.net/say/faststone.html
• https://newsn.net/say/mac-jietu.html
• https://newsn.net/say/mac-qq-jietu.html
• https://newsn.net/say/mac-snap-dmg.html

总结

chrome的这个自带的截图功能，那是非常的隐蔽。不过在特殊情景下，使用起来，还是比较方便的。更多chrome使用小技巧，请参见苏南大叔的博客：

• https://newsn.net/tag/chrome/

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。