diff options
Diffstat (limited to 'files/ja/tools/eyedropper')
-rw-r--r-- | files/ja/tools/eyedropper/index.html | 42 |
1 files changed, 42 insertions, 0 deletions
diff --git a/files/ja/tools/eyedropper/index.html b/files/ja/tools/eyedropper/index.html new file mode 100644 index 0000000000..37f9d29af4 --- /dev/null +++ b/files/ja/tools/eyedropper/index.html @@ -0,0 +1,42 @@ +--- +title: スポイト +slug: Tools/Eyedropper +translation_of: Tools/Eyedropper +--- +<div>{{ToolsSidebar}}</div><div class="geckoVersionNote"> +<p>スポイトは Firefox 31 の新機能です。</p> +</div> + +<p>スポイトツールで、ページ内から色を選択することができます。これはページ上で拡大鏡のように動作して、ピクセル単位の精度で選択することができます。拡大鏡の下には、現在選択しているピクセルの色の値を、<a href="/ja/docs/Tools/Settings#Inspector">オプション > 調査 </a>で選択した色単位で表示します:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/7749/eyedropper.png" style="display: block; height: 204px; margin-left: auto; margin-right: auto; width: 305px;">このツールは以下 2 種類の用途で使用できます:</p> + +<ul> + <li>ページから色を選択して、クリップボードにコピーする</li> + <li>インスペクターのルールビューにある色の値を、ページから選択した色に変更する</li> +</ul> + +<h2 id="Copying_a_color_to_the_clipboard" name="Copying_a_color_to_the_clipboard">色をクリックボードにコピーする</h2> + +<p>Eyedropper は 2 種類の方法で開くことができます:</p> + +<ul> + <li>"Web 開発" メニューで "スポイト" を選択する</li> + <li><a href="/ja/docs/Tools/Tools_Toolbox#Toolbar">ツールボックスのツールバー</a> でスポイトボタンをクリックする (ただし、このボタンはデフォルトで表示されていません。<a href="/ja/docs/Tools/Tools_Toolbox#Settings">開発ツールのオプション </a>で "ページから色を選択します" にチェックを入れなければなりません)</li> +</ul> + +<p>ページ上でマウスポインターを動かすのに応じて、スポイトで選択中の色の値が変わります。クリックすると、現在の色の値をクリップボードにコピーします。</p> + +<p>{{EmbedYouTube("xf2uk6UyRB8")}}</p> + +<h2 id="Changing_a_color_value_in_the_Rules_view" name="Changing_a_color_value_in_the_Rules_view">ルールビューで色の値を変更する</h2> + +<p>インスペクターのルールビューにある色の値では、隣に色のサンプルを表示しています。色のサンプルをクリックすると<a href="/ja/docs/Tools/Page_Inspector#Color_picker">カラーピッカー</a>がポップアップします。Firefox 31 より、ポップアップにスポイトのアイコンがあります。このアイコンをクリックすると、スポイトツールが起動します。</p> + +<p>スポイトツールでクリックすると、ルールビューの色がスポイトで選択した色に設定されます。</p> + +<p>{{EmbedYouTube("0Zx1TN21QOo")}}</p> + +<h2 id="Keyboard_shortcuts" name="Keyboard_shortcuts">キーボードショートカット</h2> + +<p>{{Page ("ja/docs/tools/Keyboard_shortcuts", "eyedropper")}}</p> |