HTML <input> placeholder属性
例 1
placeholder テキストを含む2つの入力フィールド：
<form action="demo-form.php">
<input type="text" name="fname" placeholder="First name"><br>
<input type="text" name="lname" placeholder="Last name"><br>
<input type="submit" value="送信">
</form>
試してみる »
placeholder テキストの色も指定できます。
例 2
placeholder テキストの色を設定します。
<form action="demo-form.php">
<input type="text" name="fname" placeholder="First name"><br>
<input type="text" name="lname" placeholder="Last name"><br>
<input type="submit" value="送信">
</form>
試してみる »
ブラウザサポート
表内の数字は、その属性をサポートする最初のブラウザのバージョン番号を示しています。
| 属性 | |||||
|---|---|---|---|---|---|
| placeholder | 10.0 | 10.0 | 4.0 | 5.0 | 11.0 |
定義と使い方
placeholder 属性は、入力フィールドの期待値を説明する短いヒント（例: サンプル値や期待される形式の短い説明）を指定します。
このヒントは、ユーザーが値を入力する前に入力フィールドに表示されます。
注意：placeholder 属性は、次の input タイプに適用されます：text、search、url、tel、email、password。
HTML 4.01 と HTML5 の違い
placeholder 属性は HTML5 で新しく追加された属性です。
構文
<input placeholder="text">
属性値
| 值 | 説明 |
|---|---|
| text | 入力フィールドの期待値を説明する短いヒントを指定します。 |
HTML <input> タグ その他の拡張機能