網頁截圖 利用Chrome內建功能快速完成!

Roy
·
·
IPFS
·

最近寫文章常常需要對網頁進行截圖,但是有些區塊的內容很長但是我們的螢幕範圍有限,只能被迫拆成多個圖片或是縮小頁面犧牲畫質,這時可以直接利用Chrome內建的截圖功能輕鬆將網頁內容擷取。

首先先到要截圖的網頁

開啟F12的開發者模式

接下來利用鍵盤快捷鍵開啟Chrome瀏覽器指令

Windows用戶快捷鍵 : Control + Shift + P

Mac用戶快捷鍵:Command + Shift + P

然後在Run區塊輸入 「cap」 關鍵字會出現以下幾個選項,這邊我是選擇全頁截圖

等待一下之後,就會出現下載提示讓我們選擇存檔位置。

  • Capture area screenshot:自定區域截圖
  • Capture full size screenshot:全頁截圖
  • Capture node screenshot:預覽截圖
  • Capture screenshot:一般截圖

最後來看一下結果,網頁內的所有資料一次就全部擷取了。

原文連結清晨小農夫

CC BY-NC-ND 2.0

Like my work? Don't forget to support and clap, let me know that you are with me on the road of creation. Keep this enthusiasm together!

RoyBackend Developer 曾在遊戲公司開發維護金流系統,使用 GCP、Linode 管理Linux伺服器 現在專注在 WordPress開發、代管,有空發表一下技術文章 個人部落格 https://rdfarm.net/
  • Author
  • More

【網域轉移】輕鬆從Godaddy 將網址轉移到NameCheap

將VestaCP 網站搬家到 HestiaCP 全視覺化主機管理工具

解決WordPress MU搭配Nginx出現頁面跑版