お問い合わせフォームの入力を分かりやすくするために、入力ボックス内に初期値としてグレー文字を表示させる方法を説明します。
↓こんな感じで初期値を設定
少しコードを加えるだけで簡単に対応できますので、ぜひ参考にしてみてください。
入力ボックスの初期値にグレー文字を表示させる2通りの方法
入力ボックスに初期値を表示させるには、
- 「input」タグに「placeholder」を追加する
- 「input」タグに「value」を追加する
の2通りの方法があります。
それぞれの方法について確認してみましょう。
【方法.1】「input」タグに「placeholder」を追加する
HTML5から導入された機能です(ほぼ全てのブラウザで対応)。「input」タグに記述するとグレーのテキストが表示されます。入力ボックス内に文字を入力するとテキストは消去されます。
<input type="text" placeholder="ボックス内に表示させたいテキストを記述">
コメント