HTML、CSS的ID與Class

  • 文章分類: 學CSS
  • 9/28/2010
HTML CSS
<div id="sample">
</div>
#sample{}
<div class="sample">
</div>
.sample{}
<div class="sample" id="sub-sample">
</div>
.sample#sub-sample{}
※ .sample和#sub-sample中間不可空格
<div id="sample" class="sub-sample">
</div>
#sample.sample{}
※ #sample和.sub-sample中間不可空格
<div class="sample"class="sub-sample">
</div>
CSS不支援此寫法
<div id="sample"id="sub-sample">
</div>
CSS不支援此寫法
<div class="sample">
    <id="sub-sample">
    </div>
</div>
.sample #sub-sample{}
※ .sample和#sub-sample中間必須空一格
<div id="sample">
    <class="sub-sample">
    </div>
</div>
#sample .sub-sample{}
※ #sample和.sub-sample中間必須空一格


  • HTML的id在CSS裡是以 # 表示,class是以 . 表示。
  • id為指定元素使用的類別名稱,屬性值不可重複。
  • class為指定元素使用的類別名稱,屬性值可以重複。