Chrome原生工具實現長截圖

文章目錄

• Chrome原生工具實現長截圖
• • 前言
  • 操作步驟
  • 參考文章

前言

我們在網上沖浪時，經常遇到一些搞笑的或者是寫的比較好的文章，想長截圖給別人分享。可是 Windows自帶的截屏功能（Win + PrintScreen）也只能截當前界面的圖，不能實現長截圖的效果，所以我們一般都會在瀏覽器中裝插件，利用插件進行長截圖。

偶然間在網上看到說，Chrome瀏覽器不用安裝插件，利用原生工具即可進行長截圖。趕緊下載了 Chrome瀏覽器進行一番試驗，原生工具真的可以進行長截圖，真是皆大歡喜。

操作步驟

首先，我們先去網上下載并安裝一個 Chrome瀏覽器，百度搜索一下即可找到下載界面，安裝也很簡單，這里不再進行贅述。

接著，我們打開 Chrome瀏覽器，選擇一個想要長截圖的網頁。比如這個頁面，我們可以看到，這篇文章內容并不算少，必須進行長截圖才行。

Chrome 原生的截圖功能隱藏在開發者工具中，所以我們要調出開發者工具界面。Windows系統可以通過以下兩種方式調出開發者工具界面

• 按下 F12鍵
• 在任意空白區域點擊鼠標右鍵，點擊“檢查”

開發者工具界面打開如下

接著我們要打開搜索命令工具條，也有兩種方式

• 按下“Ctrl + Shift + P”鍵
• 鼠標移至右上角更多按鈕，點擊 Run Command

最后，我們只需要在命令工具的輸入框中輸入對應的命令即可實現不同的截圖效果。

• Capture full size screenshot 網頁長截圖
  • 實現整張網頁長截圖，Chrome 會自動將整個網頁內容截取并保存至本地電腦，整個截取速度和效果上都有著不錯的表現
• Capture screenshot截取網頁可視區域
  • 將當前網頁顯示的區域自動截圖并保存到本地
• Capture area screenshot截取選擇部分區域
  • 將截取由用戶選擇的部分區域
• Capture node screenshot截取手機版網頁長圖
  • 將截取網頁中選定元素的內容。這一截圖命令特別之處在于，幫助用戶準確地截取網頁中特定元素的內容，首先用戶選擇網頁中某個截取元素，比如某張圖片、某個邊欄內容等，接著再運行 Capture node screenshot，這樣可以減少手動選擇截圖時的錯誤率

比如我們現在進行 Capture full size screenshot長截圖

可以看到，截圖之后，開發者工具會在左下角提示用戶截圖成功，圖片保存在 Chrome瀏覽器設置的下載路徑里面。

我們點擊查看文件，看到確實是剛才網頁的完整長截圖，大功告成。

參考文章

無需安裝插件，用 Chrome 原生工具就能實現長截圖

總結

以上是生活随笔為你收集整理的Chrome原生工具实现长截图的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。