Blog

※ブログ移転しました。 → hamashun.me

複数のclassをセレクタに指定する方法

2007年5月23日 修正および追記

この記事に対するメモ書きを作成しました。

HTMLに複数のclassを指定する事、ありますよね。

<div class="sample code">

こんな感じの。
んで、CSS側で「sampleとcode、両方のclassに適合する要素」というセレクタを書くには、

div.sample.code {
 color: red;
}

こんな感じにすればOK。 もちろん仕様書にも書いてあります。
意外と見かけないから書いてみました。

6 Comment

こんばんわ。
これ、知ってたけど実際使った事なかったです。
知ってるだけと実際活かせるかは別だし、ガンガン使える場所では使った方がいいですよね。

うーん。頑張ります。

Name:Red | 2007年05月20日 21:56

こんばんわー。 おいでませ。
いやいやっ、知っておく事が大事だと思うっすよー。
引き出しは多ければ多いほど良いですし。 良い意味で。

Name:Shun | 2007年05月20日 22:10

初めまして。
この class 属性値の複数指定、
初めて知ったのは HTML Slidy のソースを見ていてでした。

それでちょっと試したことがあるのですが、
IE だとうまく CSS でスタイルを適用できない場合が
あったように記憶しています。

div.sample.code が記述されていなくて
div.sample と div.code が記述されている場合、
div.code だけが適用されたような…。

曖昧なコメントでゴメンなさい。
その試したときの資料、頑張って掘り返してみます。

Name:ぴんどめ | 2007年05月21日 16:02

はじめまして。 コメントありがとうございます!


コメント頂いた件を試してみたのですが、再現はされませんでした。
もしかしたら、他の条件も絡んでくるのかもしれないですね。
もし今後、IEのみの不具合が起きたら、そこを疑ってみる事にします。
どうもありがとうございました。

Name:Shun | 2007年05月22日 23:00

読ませていただきました。
大変参考になりました。
これからも、良い情報の発信をしていだければと思います。
ありがとうございました。

Name:仕様書作成係 | 2009年01月19日 11:23

これ、基本なんだろうけど使ったことありませんでした。
buddypressなんかでかなり使える。

Name:ぬぬ | 2011年06月08日 10:53

Contribution Form

Blog Search
Search
Recent Entry
Category
Monthly Archive