如何在 Chrome 截圖整個網頁：3 種方法
如何在 Chrome 截圖整個網頁？其實不裝任何擴充功能也做得到，如果只是一般文章，這樣就夠了。但遇到網頁應用程式、固定頁首、捲動才載入的圖片和超長網頁，內建指令就無能為力，這時就輪到另外兩種方法上場。這篇教學列出三種方法的詳細步驟，並說明各自適合的時機。
方法 1：內建的開發人員工具指令
每個電腦版 Chrome 都有這個功能，藏在開發人員工具裡。Windows、macOS、Linux 和 ChromeOS 都能用。
開啟開發人員工具. 按 F12，或在 Mac 上按 Cmd+Option+I、在 Windows 和 Linux 上按 Ctrl+Shift+I。在哪個面板都可以。
開啟指令選單. 按 Cmd+Shift+P（Mac）或 Ctrl+Shift+P（Windows、Linux）。開發人員工具上方會出現一個搜尋框。
執行「Capture full size screenshot」. 輸入「screenshot」，選擇「Capture full size screenshot」。Chrome 會在內部捲動網頁，把整個網頁存成 PNG，放到「下載」資料夾。同一個選單裡還有「Capture screenshot」（可見的部分）、「Capture node screenshot」（你在 Elements 面板選取的單一元素）和「Capture area screenshot」。
小技巧：裝置工具列裡也有同一個指令。按 Cmd/Ctrl+Shift+M 開啟它，選一款手機或自訂寬度，再從三點選單選擇 Capture full size screenshot。想取得網站行動版版面的整頁截圖，這是最快的方法。
做不到的地方。這個指令只會擷取網頁元素一次，而且是當下的樣子。因此：
- 固定的頁首、Cookie 橫幅或聊天泡泡會在圖片裡每隔一個畫面高度就出現一次，或蓋在文字上面。
- 捲動才載入的圖片常常會不見，因為根本沒有捲動。先手動捲到底會有點幫助，但不保證有效。
- 在面板裡捲動、而不是整頁捲動的網頁（Gmail、Notion、Slack、大多數管理後台），截出來只有一個畫面高，面板被切掉。
- 超長網頁可能會截出空白或被截斷，而且沒有任何警告。
- 不能複製到剪貼簿，沒有編輯器、不能存 PDF，也沒有紀錄，只會得到一個檔案。
方法 2：整頁截圖擴充功能
擴充功能會在你的分頁裡一個畫面接一個畫面地捲動，再把結果拼接起來，所以能處理上面那些情況。Chrome 線上應用程式商店裡有好幾款；以下步驟以我們開發的免費 Chrome 長截圖擴充功能 FullPage Capture 為例，其他款的做法也大同小異。
安裝 FullPage Capture. 從 Chrome 線上應用程式商店安裝；使用 Edge 的話，從 Edge 附加元件安裝。免費、不需帳號、沒有浮水印。
按一下圖示，或按快速鍵. 預設是 Alt+Shift+K。網頁會自動捲動並擷取：固定的頁首只拍一次，捲動擷取其餘部分時會先隱藏；捲動才載入的圖片會等它顯示出來；網頁內部捲動的面板也會自動展開。
使用擷取結果. 結果分頁隨即開啟，整個網頁就是一張圖片。可以複製到剪貼簿、在編輯器裡加上箭頭和文字、模糊私人資訊、裁切成需要的尺寸，或存成 PNG、JPEG，以及分頁落在兩行之間的 PDF。
在這個網頁上試試看。免費、不需帳號，不會上傳任何東西。
加到 Chrome和開發人員工具相比：
| 開發人員工具：Capture full size screenshot | FullPage Capture | |
|---|---|---|
| 如何開始 | F12、Cmd/Ctrl+Shift+P，再輸入指令 | 按一下，或按 Alt+Shift+K |
| 固定頁首只出現一次 | 否 | 是 |
| 捲動才載入的圖片 | 常常不見 | 會等它載入 |
| 網頁內部捲動的面板 | 否 | 是 |
| 內嵌框架和 PDF 檔案 | 否 | 是 |
| 超長網頁 | 可能空白或被截斷 | 超過 28,800 px 時分成編號區塊 |
| 複製到剪貼簿 | 否 | 是 |
| 標註、模糊、裁切 | 否 | 是儲存編輯過的截圖是 Pro 功能 |
| 有分頁和可點按連結的 PDF | 否 | 是 |
| 不必安裝任何東西 | 是 | 否免費、不需帳號 |
方法 3：需要文件時，用列印存成 PDF
如果你要的是方便傳送或存檔的文件，而不是圖片，內建的方法是 Chrome 的列印（Cmd/Ctrl+P），目的地選另存為 PDF。但要先知道結果會是什麼樣子：Chrome 會用網站的列印樣式表重新排版，所以很少會和螢幕上一樣；背景和深色主題通常會消失，文字行會在頁與頁之間被切開，在面板裡捲動的內容只會印出已經捲到的部分。不過連結仍然可以點按，文字也可以選取。
擴充功能的 PDF 匯出則是從截圖出發：可以是一整張長頁面，也可以是 Letter、Legal 和 A4，分頁落在兩行之間，連結也照樣能用。把網頁存成 PDF 頁面有詳細說明和對照表。
簡單方法會失敗的情況
- Gmail、Notion、Trello、儀表板。網頁本身不捲動，捲動的是裡面的面板。請用擴充功能：它會先擷取整個視窗一次（包括側邊欄和頁首），然後只展開那個面板。
- 無限捲動（社群動態、聊天）。這類網頁沒有盡頭。捲到你需要的地方再擷取；擴充功能會擷取當時已載入的內容。
- 固定頁首和 Cookie 橫幅。先關掉橫幅，再用擴充功能擷取，頁首只會保留一次。用開發人員工具的話，執行指令前先在 Elements 面板刪除頁首的節點。
- 超長網頁。Chrome 的畫布每邊上限是 28,800 像素。超過時擴充功能會存成幾個編號區塊；開發人員工具則可能什麼都沒存下來。
- 需要登入或在內部網路上的網頁。兩種方法都可以，因為都在你的分頁裡執行。線上服務不行。
- 只要一個元素（表格、圖表）。在開發人員工具裡選取該元素，用「Capture node screenshot」。用擴充功能的話，擷取後在編輯器裡裁切成精確的像素尺寸。
- 行動版版面。用上面提到的開發人員工具裝置工具列；或把視窗縮窄，再用擴充功能擷取。
- 在 Chrome 裡開啟的 PDF。只有擴充功能可以：它會把檔案的每一頁算繪成一張圖片。
- 高解析度。兩種方法都以螢幕的像素密度擷取（Retina 螢幕是 2 倍）。擷取前先放大網頁，每個元素就能得到更多像素。
Windows、Mac 和 Chromebook
上面的內容都和作業系統無關：開發人員工具和擴充功能在任何平台的 Chrome 裡表現都一樣。不同的是系統自帶的截圖工具，而它們都只能截到螢幕範圍：Windows 上的剪取工具和 Print Screen，Mac 上的 Shift+Cmd+3 和 4，Chromebook 上的 Ctrl+顯示視窗。Microsoft Edge 是唯一在截圖工具裡內建整頁選項的電腦版瀏覽器；請參考 Edge 整頁截圖。在 iPhone 或 Android 手機上，整頁截圖內建在系統的截圖功能裡，手機上也無法執行擴充功能。
常見問題
Chrome 整頁截圖的快速鍵是什麼？
Chrome 本身沒有；內建的方法要透過開發人員工具的指令選單（F12，接著 Cmd/Ctrl+Shift+P，再選「Capture full size screenshot」）。安裝 FullPage Capture 後，快速鍵是 Alt+Shift+K，可以在 chrome://extensions/shortcuts 變更。
為什麼整頁截圖少了圖片，或出現灰色方塊？
這個網頁會在捲動時才載入圖片，而內建指令在圖片出現前就拍下網頁了。執行指令前先把網頁捲到底一次，或改用擴充功能，它會等每個畫面載入完成再擷取。載入特別慢的網頁，可以在擴充功能的選項裡延長等待時間。
為什麼頁首在每個畫面都重複出現？
拼接畫面的工具，每個畫面都會拍到捲動時固定不動的頁首。擴充功能只在最上方拍一次，之後的擷取過程都會把它隱藏。用開發人員工具的話沒辦法解決，只能先在 Elements 面板裡自己把頁首隱藏。
為什麼截圖被切掉，或比網頁短？
通常是因為網頁本身沒有捲動，捲動的是裡面的面板（Gmail、Notion、Trello、大多數儀表板）。內建指令擷取的是網頁元素，只會拍到面板的一個畫面。擴充功能會找到真正在捲動的區域並把它展開。另一個原因是網頁太長，超過 Chrome 的畫布上限；這時擴充功能會存成幾個編號區塊。
需要登入的網頁也能整頁截圖嗎？
可以，兩種方法都行，因為都是在你已經登入的分頁裡執行。線上的「網址轉截圖」服務就不行，因為它們的伺服器並沒有以你的身分登入。
可以把 Chrome 裡開啟的 PDF 整份截圖嗎？
開發人員工具的指令不行，它在 Chrome 的 PDF 檢視器裡無法使用。擴充功能則會自行算繪檔案，把每一頁擷取成一張圖片。
在 Chromebook 上要怎麼用 Chrome 整頁截圖？
一樣是兩種方法：開發人員工具的「Capture full size screenshot」，或擴充功能。Chromebook 的快速鍵 Ctrl+顯示視窗只能截到螢幕範圍。
整頁截圖和滾動截圖是一樣的嗎？
是的。滾動截圖、長截圖和整頁截圖，指的都是把比螢幕還長的網頁存成一張圖片。手機上叫滾動截圖或長截圖，電腦上的工具叫整頁截圖。 Chrome 的滾動截圖
就在你正在讀的這一頁試試看。 免費、不用帳號、沒有浮水印，什麼都不會上傳。
加到 Chrome