长截图 ,过去我们如果想要截图网页所有画面的话,都需要透过 Chrome 的扩充外挂才能实现,因为页面非常的长,事实上在 Chrome 59 之后的版本,开发人者工具就已经有自带长截图的指令,也代表着不用安装任何外挂,轻松利用内建功能即可撷取网页的所有画面,下面就来教大家怎么使用。
首先你必须确定你的 Chrome 版本是不是 59 以后,进到右上角的 … 选项后,打开说明里的关于 Google Chrome:
画面就会显示你目前的 Chrome 版本,如果有新版本,右侧也会推荐重新启动来更新:
紧接着进入到你要截图的网页页面后,进到上方的检视 -> 开发人员选项,打开 “开发人员工具”,或是使用快捷键 Command+Option+I 来快速开启(Windows 快捷键为 F12),底部就会跳出一堆程式码工具视窗:
然后再按下 Command+Shit+P 来开启指令搜寻功能(Windows 快捷键为 Ctrl+Shift+P),中间就会出现命令字段,输入 “Capture” 关键字,会找到 3 个前面显示 Mobile 的指令,第一个 “Capture full size screenshot“ 就是撷取网页的所有画面:
点选之后,Chrome 就会开始渲染画面,接着自动下载完整截图至你的下载目的地(如:下载资料夹),从档案详细资讯可以看到,分辨率非常大:
即便放大某区块依旧非常清楚,品质非常不错,未来就不用再安装任何外挂来来长截图了:
另外 Capture screenshot 是仅撷取你目前浏览的画面,例如刚进到电脑王阿达的网页时,会停留在上方,而 Chrome 就会把目前显示的画面撷取下来:
至于 Capture node screenshot 是撷取网页中你指定的物件,需搭配 Command+Shift+C 快捷键工具来完成(Windows 为 Ctrl+Shift+C),这我是觉得没什么用,读者们可自行试试看: