2015/07/31WEBサイトで使う入力フォームに、その欄の例としてうっすらと文字が見えるものがありますよね。あれはplaceholder属性というものを使ってるんですが、そのテキストの色を変えたかったので調べてみました。コピペで使えるようにソースも載せてますのでどうぞご利用ください。LINKplaceholder属性の使い方まずHTMLはこんな感じです。09012345678&quot;&gt;&lt;/form&gt;サンプルなのでシンプルに書いてますが、重要なのはplaceholder="表示させたいもの"という記述だけです。▼こんな感じに設定した文字列が表示されます。placeholder属性で表示されるテキストの色を変えるでは本題のplaceholder属性で表示されるテキストの色を変える記述がこちらです。上からChrome・Safari、Firefox、IE用の記述です。#ccc;}色は#cccという薄いグレーにしてますが、お好きな色に変更してください。こちらのコードは下記の記事を参考にしました。Qiita僕なりにいじったのは「古いFirefox対応を切り捨て」したこと。自動でアップデートしてくれるブラウザなので問題ないと思ってver18以前に対応する記述を消しました。IE10以降に対応するために「-ms-」の記述は入れてますが、ここでIE9以前はそもそもplaceholder属性が使えないことを調べてから初めて知ったので、対応するには下記のようなことをしないといけません。terkel.jpというわけで、あくまで「placeholderはヒントを出すもの」として捉えて、最悪表示されなくても迷わずに入力できる設計をすることが一番かなと。タイトル工夫したりコメント添えたり配置をうまいことあれしたり。最後にOperaについては完全に無視したまま来ましたが、ベンダープレフィックスを「-o-」に代えて試したらうまくいくんじゃないかと勝手に妄想してます。誰か試した方いたら教えてください。WEBサイトの制作や管理、WEBサービスの運営、iPhoneアプリ開発などをやってます。chord」のギタリストで曲も作ったりしてます。ねこでこ」がうまい!エンタメモーニング娘。ハマった理由と、EDM路線になってからのモーニング娘。Macなどのコンピューター系の話題など、WEBデザイナーの管理人が気になった情報を発信しているブログです。株式会社ondoホームカテゴリ。