【CSS】::placeholder（擬似要素） - プレイスホルダー

CSSの擬似要素の１つ、placeholderについてご紹介します。

placeholder

擬似要素placeholderはプレイスホルダーの文字列です。
通常、input要素やtextarea要素のプレイスホルダーのセレクターに使用します。

基本構文

::placeholder {
    プロパティ名: プロパティ値;
}

サンプル

次のコードは擬似要素placeholderでinput要素のプレイスホルダー文字列のカラーを赤にします。

<style>
input[type="text"]::placeholder {
    color: red;
}
</style>

<input type="text" placeholder="keyword">