關於css選擇器(多重id/ class)

文章來源：multiple class id selectors

本篇文章主要在講多重id與class的運用。

範例一：

html
<div id="myid" class="myclass"></div>

css:
要指定上述的div可以有以下三種寫法，
#myid{ color:red;}
.myclass{color:red;}
#myid.myclass{ color:blue;} /*注意中間沒有空格喔*/

說明：除了可以寫#myid, 或者 .myclass 來指定這個div，
也可以將此寫成 #myid.myclass  來選擇這個div

 

範例二：

html
<div class="myclass1 myclass2 myclass3">

css
.myclass1{color:red};
.myclass2{color:blue}
.myclass3{color:red}
.myclass1.myclass2.myclass3{color:blue}/*這樣的寫法也是扣以的喔*/

除了用前面三項單一的class名稱選擇
當然也可以用.myclass1.myclass2.myclass3來指定這個div

相容性與支援
各瀏覽器與ie7以上都支援這種寫法
ie6如果遇到這種寫法，則只會識別第一個class
用以上例子說明，ie6只會識別.myclass1 這個class名稱

所以對ie6而言 將會選擇到所有套有.myclass1的html tag,
而非是同時套有.myclass1, .myclass2, .myclass3這三個class的html tag上喔。