你必須很努力

Day02 - Chrome 的小技巧 - 內建截圖功能

2020/09/07
字數統計: 748閱讀時間: 2 min

前言

Chrome 是許多人電腦必裝的瀏覽器之一,自今年微軟 (Microsoft) 宣佈 Internet Explorer (以下簡稱 IE) 最後支援時間 (2021年8月17日) 後,可以聽到許多工程師的歡呼,在寫這段時,有特地到微軟官方網站查詢生命週期,發現還查不到結束日期,查詢結果截圖如下:

但類似的報導網路垂手可得,反而在自家網頁還看不到,同時也驗證了以下這張梗圖:

(圖片出處: 純靠北工程師)

以上博君一笑


Full-page screenshots

隨著 Chrome 越來越強大 (記憶體也越吃越多
內建的功能也很實用,像是內建網頁截圖功能
早在 Chrome 59 版開始,便支援 Full-page screenshots

使用步驟

  1. 用 Chrome 開啟想要截圖的網頁 (以 https://riverye.com/ 為例)
  2. 鍵盤 F12 開啟開發者工具
    Windows 用戶: 或 Ctrl + Shift + c
    Mac 用戶: 或 (Cmd)鍵 ⌘ + Shift 鍵 ⇧ + c
  3. 接著輸入
    Windows 用戶: Ctrl + Shift + p
    Mac 用戶: (Cmd)鍵 ⌘ + Shift 鍵 ⇧ + p

另一種截圖方式

說明

Capture area screenshot:指定特定區域

Capture screenshot:僅截圖所看到的區域

Capture full size screenshot:整個網頁

參考資料

官方教學操作影片 Full-Page Screenshots (Chrome 59)


同場加碼

Windows 10 截圖快捷鍵:

全螢幕截圖: PrintScreen
視窗截圖: Alt + PrintScreen (接著開啟小畫家,Ctrl + v 即可貼上)
特定區域截圖: Win + Shift + s

註:PrintScreenAltWin...等皆是鍵盤上的快捷鍵

Windows 10 內建截圖軟體:

  1. 本人使用的 Windows 10 版本為 1909 (OS 組建 18363.1016)

  2. 在工具列左下角點「開始」(Windows 圖案),接著搜尋「剪取」可以找到兩套內建的軟體,分別是「剪取工具」與「剪取與繪圖」。

Windows 推薦截圖軟體:

軟體名稱:PicPick

軟體說明:支援全螢幕、使用中視窗、捲動視窗、固定區域、手繪區域...等各種模式,加上內建強大「圖片編輯器」功能,又有免安裝版,非常好用。

PicPick 程式選項:

PicPick 圖片編輯器:

macOS 截圖快捷鍵:

全螢幕截圖:(Cmd)鍵 ⌘ + Shift 鍵 ⇧ + 數字 3
指定區域截圖:(Cmd)鍵 ⌘ + Shift 鍵 ⇧ + 數字 4
固定區域截圖: (Cmd)鍵 ⌘ + Shift 鍵 ⇧ + 數字 5
視窗截圖(有陰影):

  1. 先按 (Cmd)鍵 ⌘ + Shift 鍵 ⇧ + 數字 4,然後放開
  2. 接著再按 空白鍵 一下,然後放開
  3. 點選想截圖的視窗

視窗截圖(無陰影):

  1. 先按 (Cmd)鍵 ⌘ + Shift 鍵 ⇧ + 數字 4,然後放開
  2. 接著再按 空白鍵 一下,然後放開
  3. 按著 Option(或 Alt)鍵 ⌥ 不放
  4. 同時點選想截圖的視窗

小結

同時記錄 Windows 和 Mac 的操作方式,花比預期還長一點的時間寫此文,希望能幫助到看到的人


鐵人賽文章連結:https://ithelp.ithome.com.tw/articles/10234563
medium 文章連結:https://link.medium.com/oZb6FTK0y9
本文同步發布於 小菜的 Blog https://riverye.com/

備註:之後文章修改更新,以個人部落格為主

原文連結:https://riverye.com/2020/09/07/Day02-Chrome-的小技巧-內建截圖功能/

發表日期:2020-09-07

更新日期:2022-12-21

CATALOG
  1. 1. 前言
  • Full-page screenshots
    1. 1. 使用步驟
    2. 2. 說明
      1. 2.1. Capture area screenshot:指定特定區域
      2. 2.2. Capture screenshot:僅截圖所看到的區域
      3. 2.3. Capture full size screenshot:整個網頁
    3. 3. 參考資料
  • 同場加碼
    1. 1. Windows 10 截圖快捷鍵:
    2. 2. Windows 10 內建截圖軟體:
    3. 3. Windows 推薦截圖軟體:
      1. 3.0.1. 軟體名稱:PicPick
      2. 3.0.2. 軟體說明:支援全螢幕、使用中視窗、捲動視窗、固定區域、手繪區域...等各種模式,加上內建強大「圖片編輯器」功能,又有免安裝版,非常好用。
  • 4. macOS 截圖快捷鍵:
  • 5. 小結