Google Chromeのデベロッパーツールを使って画面のキャプチャを撮ることがあるのですが、なんでか指定した大きさの縦横2倍の画像が出来上がるので、今までいちいち縮小してました。
最近、複数続けて撮ることがあり、後で修正するのも嫌だったので、検索かけてみたら、ちゃんと説明してくれているページがみつかりました。
URLを貼って終わりでも良かったのですが、一応自分なりにまとめておくことにしました。
Google Chrome デベロッパーツールの起動の仕方
- Windows F12キーを押す / 「Ctrl+Shift+i」を押す
- Mac 「Command+Option+i」を押す
- Chrome設定＞その他のツール＞デベロッパーツール
※もう一度同じ操作をすると通常画面に戻ります
Google Chrome デベロッパーツールの設定の仕方
- Dimensionsで「Responsive」選択し、画面サイズ（横幅・縦幅）を数値（ピクセル）で設定する
- 「設定（縦に並んだ３点）ボタン」を押して、「メニュー（緑枠内）」を出す。
- 「Add device pixel ratio」を選ぶ
※「Remove device pixel ratio」になっていたらクリックしないでそのままにしておく - DPRが「2.0」等になっていたら「1.0」を選ぶ
- ②の設定ボタンを再度押してメニューを出し、Capture screenshot（見えている部分だけ）かCapture full size screenshot（画面全体）かを選ぶ
- ダウンロードフォルダなどにキャプチャ画像が保存される。
参考サイト↓
