1 files changed, 52 insertions, 0 deletions
diff --git a/files/ja/tools/taking_screenshots/index.html b/files/ja/tools/taking_screenshots/index.html
new file mode 100644
index 0000000000..41c1b1a30c
--- /dev/null
+++ b/files/ja/tools/taking_screenshots/index.html
@@ -0,0 +1,52 @@
+---
+title: スクリーンショットを撮影する
+slug: Tools/Taking_screenshots
+tags:
+  - Tools
+translation_of: Tools/Taking_screenshots
+---
+<div>{{ToolsSidebar}}</div>
+
+<p>開発ツールを使用して、ページ全体またはページ内のひとつの要素のスクリーンショットを撮影できます。</p>
+
+<h2 id="Taking_a_screenshot_of_the_page" name="Taking_a_screenshot_of_the_page">ページのスクリーンショットを撮影する</h2>
+
+<p>現在のページ全体のスクリーンショットを撮影するには、スクリーンショットのアイコン (<img alt="" src="https://mdn.mozillademos.org/files/14713/camera-icon.png" style="height: 16px; margin-bottom: -4px; width: 18px;">) を使用します。</p>
+
+<p>デフォルトでは、スクリーンショットのアイコンが有効化されていません。有効にする方法は以下のとおりです:</p>
+
+<ul>
+ <li><a href="/ja/docs/Tools/Settings">オプション</a> ページを開きます。</li>
+ <li>"利用可能なツールボックスのボタン" のセクションを探します。</li>
+ <li>"ページ全体のスクリーンショットを撮影します" にチェックを入れます。</li>
+</ul>
+
+<p>以上で、ツールバーにアイコンが表示されます:</p>
+
+<p>{{EmbedYouTube("KB5V9uJgcS4")}}</p>
+
+<p>アイコンをクリックすると、現在のページのスクリーンショットを撮影します。スクリーンショットは、ブラウザーの "ダウンロード" ディレクトリーに保存します:</p>
+
+<p>{{EmbedYouTube("HKS6MofdXVE")}}</p>
+
+<h2 id="Taking_a_screenshot_of_an_element" name="Taking_a_screenshot_of_an_element">要素のスクリーンショットを撮影する</h2>
+
+<p>ページ内のひとつの要素のスクリーンショットを撮影するには、<a href="/ja/docs/Tools/Page_Inspector/UI_Tour#HTML_pane">インスペクターの HTML ペイン</a> でその要素のコンテキストメニューを開いて、"ノードのスクリーンショットを撮影" を選択します。スクリーンショットは、ブラウザーの "ダウンロード" ディレクトリーに保存します:</p>
+
+<p>{{EmbedYouTube("p2pjF_BrE1o")}}</p>
+
+<h2 id="Copying_screenshots_to_the_clipboard" name="Copying_screenshots_to_the_clipboard">スクリーンショットをクリップボードにコピーする</h2>
+
+<p>Firefox 53 より、スクリーンショットをクリップボードにコピーすることもできます。開発ツールのオプションで "Screenshot to clipboard" にチェックを入れてください:</p>
+
+<p>{{EmbedYouTube("AZedFGh6F78")}}</p>
+
+<p>スクリーンショットを撮影すると、クリップボードへのコピーも行います。</p>
+
+<p> </p>
+
+<h2 id="アディショナルオプション">アディショナルオプション</h2>
+
+<p>別のデバイスとピクセルの比率を指定する必要がある場合、スクリーンショットを撮る前に遅延を設定するか、独自のファイル名を指定する必要がある場合は、Web コンソールで <code>:screenshot</code> <a href="/ja/docs/Tools/Web_Console/The_command_line_interpreter#Helper_commands">ヘルパー関数</a>を使用できます。</p>
+
+<p> </p>