綾小路龍之介の素人思考

[css] 色指定用のcssファイル

色指定を個別にする場合にタグのstyle属性の属性値にbackground:#FF0000とか指定する。例えば下のような感じ。

<div style="background:#FF0000; color:#00FF00;">背景色が赤で文字色が緑</div>

でも、統一的な外観をキープするためにはclass指定したほうがいいと思う。そこで下のような内容のファイルを作ってhtmlファイルからは外部cssファイルとして参照する。

.bg00{ backgrond:#FF0000; }
.co00{ color:#00FF00; }

その上で、上で挙げた例を書き換える。class属性の属性値にスペース区切りでclassを複数指定すれば指定されたclassが組み合わされて適用される。異なるclassで同じcssの属性に対して指定が行われている(css属性値の衝突する)場合は、後に指定したclassの属性が優先される。

<div class="bg00 co00">背景色が赤で文字色が緑</div>

もし、よく出来たブラウザとwebサーバがあるのなら、すべての色コードについてこのようなclassを作っておいても良いかもしれない。そうすればファイルサイズを小さく出来たり、データ転送量も減らせるかもしれないから。でも、この方法のポイントは統一的な外観を作ること。なので、いくつかの良く使う色と属性についてこのようなセットを作っておくことこそ本来の意味があると思う。

  1. OZACC.blog: CSS ひとつの要素に複数のクラス
  2. css 複数 class - Google 検索

ソーシャルブックマーク

  1. はてなブックマーク
  2. Google Bookmarks
  3. del.icio.us

ChangeLog

  1. Posted: 2009-04-10T12:39:20+09:00
  2. Modified: 2009-04-10T12:39:20+09:00
  3. Generated: 2016-12-29T23:09:20+09:00