有時候因為工作上的需要會要把整個網頁擷取成一張圖檔,例如,上了新網頁要放到報告中,或是要把預覽網頁截圖下來給合作夥伴看…等,以往都得要額外安裝軟體,最近發現原來 Chrome 就內建這種功能了,真是太方便啦!
不過這功能的路徑藏得有點深,一般情況下應該是找不到,但其實很簡單,跟著宅爸做一次就會了。
🗣 寫這篇文章時所用的 Chrome 版本為 85.0.4183.102 (正式版本)。
步驟二:打開 device toolbar 面板
一樣有兩種方法:
- 點開發者工具面板左上角左邊數來第二個 Icon。
- Window 可按快捷鍵 Ctrl + Shift + M。
步驟三:設定解析度
在 device toolbar 中,可設定要用哪種裝置的螢幕解析度來截圖,內建已經有一些手機型號,也包含 iPad,若沒有中意的裝置,可以按裝置選單最下方的 Edit 去新增。
我通常是直接選 Responsive,然後手動設定長寬,也可以直接用滑鼠拉右下角的截角去快速調整。
解析度右邊可以設定網頁顯示比例,但若沒特別需求不必去動它。
步驟四:截圖
點 device toolbar 面板右上角海帶條打開選單 → 點「 Capture full size screenshot」即可產生圖檔囉!
常見問題
截下來的圖檔放在哪裡?
就存放在你 Chrome 所設定的下載位置,可以去「設定」➝「進階」➝「下載」➝「位置」做變更。