類選擇符(E.class)

語法:

E.myclass { sRules }

說明:

以class屬性包含myclass的E物件作為選擇符。
  • 類選擇符(Class Selector)
  • 不同於ID選擇符的唯一性,類選擇符可以同時定義多個,如:

    定義多個類:

    .a { color: #f00; } .b { font-weight: 700; } <div class="a b">給某個div元素定義.a和.b兩個類</div>

    注意,id選擇符不能在同個元素上定義多個,比如id="a b"就是錯誤的寫法

    類選擇符高級用法:多類選擇符

    .a.b { color: #f00; } <div class="a b">多類選擇符使用方法</div>

    此例命中同時擁有.a和.b兩個類的元素。需要注意的是IE6並不支援多類選擇符,如:.a.b{}將會被視為:.b{}

兼容性:

  • 淺綠 = 支援
  • 紅色 = 不支援
  • 粉色 = 部分支援
IE Firefox Chrome Safari Opera iOS Safari Android Browser Android Chrome
6.0 #1 2.0+ 4.0+ 3.1+ 3.5+ 3.2+ 2.1+ 18.0+
7.0+
  1. 不支援多類選擇符,形如:.a.b {}

示例: