Google截取網頁長圖

利用 Chrome 原生工具進行網頁長截圖

Chrome 開發者工具中其實自帶了截圖命令,效果令人十分滿意,在這裏分享給大家。

1.要想使用截圖功能,你需要首先確保 Chrome 已升級至 59 或更高版本。在想要截圖的網頁中,首先按下 ⌘Command + ⌥Option + I(Windows 爲 F12)快捷鍵,召喚出調試界面。
在這裏插入圖片描述
2.隨後,按下 ⌘Command + ⇧Shift + P(Windows 爲 Ctrl + Shift + P),輸入命令 Capture full size screenshot(只輸前幾個字母就能找到),敲下回車,Chrome 就會自動截取整個網頁內容並保存至本地。由於是渲染引擎直接輸出,其比普通擴展速度更快,分辨率也更高。
在這裏插入圖片描述
另外-1
除了普通長截圖以外,你還可以利用這一功能截取手機版網頁長圖。只需要按下 ⌘Command + ⇧Shift + M (Windows 爲 Ctrl + Shift + M)模擬移動設備,再按剛纔的方法運行命令就可以了。在頂部的工具欄中,你可以選擇要模擬的設備和分辨率等設置。
在這裏插入圖片描述
0-2
如果你想準確截取網頁的某一部分,可以按下 ⌘Command + ⇧Shift + C(Windows 爲 Ctrl + Shift + C)嗅探元素。選中想要的部分後,再運行 Capture node screenshot 命令,一張完美的選區截圖就誕生了。
在這裏插入圖片描述
此外,Capture screenshot 命令可以讓你截取當前網頁的可視部分。

發佈了23 篇原創文章 · 獲贊 100 · 訪問量 8241
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章