開発ツールを使用して、ページ全体またはページ内のひとつの要素のスクリーンショットを撮影できます。
ページのスクリーンショットを撮影する
現在のページ全体のスクリーンショットを撮影するには、スクリーンショットのアイコン (
) を使用します。
デフォルトでは、スクリーンショットのアイコンが有効化されていません。有効にする方法は以下のとおりです:
- オプション ページを開きます。
- "利用可能なツールボックスのボタン" のセクションを探します。
- "ページ全体のスクリーンショットを撮影します" にチェックを入れます。
以上で、ツールバーにアイコンが表示されます:
アイコンをクリックすると、現在のページのスクリーンショットを撮影します。スクリーンショットは、ブラウザーの "ダウンロード" ディレクトリーに保存します:
要素のスクリーンショットを撮影する
ページ内のひとつの要素のスクリーンショットを撮影するには、インスペクターの HTML ペイン でその要素のコンテキストメニューを開いて、"ノードのスクリーンショットを撮影" を選択します。スクリーンショットは、ブラウザーの "ダウンロード" ディレクトリーに保存します:
スクリーンショットをクリップボードにコピーする
Firefox 53 より、スクリーンショットをクリップボードにコピーすることもできます。開発ツールのオプションで "Screenshot to clipboard" にチェックを入れてください:
スクリーンショットを撮影すると、クリップボードへのコピーも行います。
アディショナルオプション
別のデバイスとピクセルの比率を指定する必要がある場合、スクリーンショットを撮る前に遅延を設定するか、独自のファイル名を指定する必要がある場合は、Web コンソールで :screenshot ヘルパー関数を使用できます。