<p dir="auto"><a href="https://pixabay.com/en/chrome-browser-web-internet-2815967/" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">image source
<p dir="auto">这篇文章很久以前就想写,当时 Chrome 62 刚刚更新,在开发者工具里加入了截图功能(可以截取整个页面)。一直拖着,今天有空,赶紧补上。英文ok的可以看<a href="https://developers.google.com/web/updates/2017/08/devtools-release-notes#screenshot-areas" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">官方介绍,下面介绍怎么用。
<ul>
<li><h4>鼠标选取截图
<ol>
<li><p dir="auto">进入开发者工具,点击<strong>Inspect或快捷键 Command+Shift+C (Mac) 或 Control+Shift+C (Windows, Linux) 进入<strong>元素选择模式。
<li><p dir="auto">按住 Command (Mac) 或 Control (Windows, Linux)键,并选择你想要截取的区域。
<p dir="auto"><img src="https://images.hive.blog/768x0/https://developers.google.com/web/updates/images/2017/08/screenshot.png" srcset="https://images.hive.blog/768x0/https://developers.google.com/web/updates/images/2017/08/screenshot.png 1x, https://images.hive.blog/1536x0/https://developers.google.com/web/updates/images/2017/08/screenshot.png 2x" />
<li><p dir="auto">释放鼠标,截图会被自动下载下来。
<li><h4>命令截图
<ol>
<li><p dir="auto">在<strong>元素面板中选择想要元素,或者也可以进入<strong>元素选择模式,鼠标选中需要的元素(不用按住 Command 或 Control 键)。
<p dir="auto"><img src="https://images.hive.blog/768x0/https://developers.google.com/web/updates/images/2017/08/target-node.png" srcset="https://images.hive.blog/768x0/https://developers.google.com/web/updates/images/2017/08/target-node.png 1x, https://images.hive.blog/1536x0/https://developers.google.com/web/updates/images/2017/08/target-node.png 2x" />
<li><p dir="auto">输入Cmd+Shift+P (Mac) 或者 Ctrl+Shift+P (Windows, Linux) 打开命令行。
<li><p dir="auto">在命令行中输入 <code>cpature 这后,下面会出现截图选项,可以截取刚刚选择的元素,也可以全屏截图,甚至可以滚动截取整个页面。
<h2><strong>What you want, Go after It.
<hr />
<h4><a href="https://steemit.com/" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">https://steemit.com 首发。感谢阅读。
<h4>欢迎Follow, Upvote, Reply, Resteem (repost)激励我创作更多更好的内容。
<p dir="auto"><a href="https://steemit.com/@syt" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">@syt