[解決済み】デベロッパーツールでwebkit-input-placeholderを検査する。

質問

テキスト入力のプレースホルダーに、以下のようなスタイルを設定することが可能です。

-webkit-input-placeholder {
    color: red;
}

あるサイトをネットで見ているのですが、そのサイトと同じプレースホルダーの色を使いたいのです。どのような色を使用したかを把握することは可能でしょうか？アルファ値も含めたいので、イメージエディターで色をサンプルすることはできません。

Chrome Dev Toolsで要素を検査すると、こうなります。

Dev tools では、input 要素の検査時にプレースホルダー要素に関する情報を提供しません。他の方法はありますか？

解決方法を教えてください。

わかったよ。

コツは、Chrome Developer Toolsの設定パネルで「Show user agent shadow DOM」を有効にすることです。

Dev Toolsパネルの右上にある歯車のアイコンをクリックし、左側のPreferencesタブが選択されていることを確認し、Elementsの見出しを見つけ、その下にある "Show user agent shadow DOM" チェックボックスをチェックしてください。

これで、表示されるようになりました。