2020年5月2日 星期六

Chrome的「開發人員工具」竟然可以截圖

前幾天才發現的一個Chrome特技吧!不曉得有多少人知道,Chrome瀏覽器的「開發人員工具」竟然可以截圖。

首先,要將你的 Google Chrome 瀏覽器更新升級到 59 或更高版本,接著以快捷鍵 F12 (Mac 為 Command + Option + I)開啟開發人員工具功能,如下圖會出現許多網頁開發者需要的相關工具。

開啟「開發人員工具」後隨即按下 Ctrl + Shift + P(Mac 為 Command + Shift + P),會出現可輸入指令列的工具,輸入開頭為「Capture」的關鍵字,就會出現有「Capture area screenshot」「Capture full size」「Catpture node screenshot」「Catpure screenshot」等截圖指令,選取適當的指令按下 Enter 後,就會進行截圖,指令意思分別為:

1. Capture area screenshot:擷取選取區域
2. Capture full size:擷取全部整個網頁
3. Catpture node screenshot:擷取網頁中你指定的物件(實際上我試不出來)
4. Catpure screenshot:擷取可視區域 (viewport)


沒有留言:

張貼留言