HTML5 入力フォームに薄い文字を表示する

最近、サイト制作で使ったので、備忘録として記事に残したいと思います。

入力フォームには、あらかじめ薄い文字で入力する内容を表示させていることがあります。
この薄い文字は、入力する時にクリックすると薄い文字は消えまので、初期値設定でこの文字を表示させるようにするのが、「placeholder」属性ですね。

他の方法としては、JavaScript でも設定可能なのですが、「placeholder」属性で初期値に設定するほうが、断然簡単でしたので、私はこの方法で設定しました。。。

設定は、この部分「placeholder=”◯◯◯◯◯”」ですね。

◯◯◯◯の部分に、「表示させたい薄い文字」を設定します。

これだけですねぇ〜!!
簡単ですよね、是非参考に・・

この記事が気に入ったら
いいね または フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

元農業土木設計技士のお仕事からWebクリエイターへ転身しました。
札幌拠点としてホームページ作成(Ameba Ownd、WordPressカスタマイズ)、IT・WEBトータルサポートをメインで活動しております。
今後は、IT・Webを含めたトータルプロデュースも行っていきます。
どうぞよろしくお願いいたします。

目次