康廷數位: CSS 選擇器（1）- ID & 類別選擇器

康廷數位: CSS 選擇器（序）

在序這一篇裏面，討論了ID選擇器，透過 #ID 格式的字串，CSS 可以據以取出特定的元素，如果元素是一個以上的話，可以透過類別選擇器，如下：

id="div_a"
class="cls_a"

id="div_b"
class="cls_b"

id="div_c"
class="cls_b"

id="div_d"
class="cls_c"

id="div_e"
class="cls_c"

id="div_f"
class="cls_b"

id="div_g"
class="cls_a"

id="div_h"
class="cls_d"

針對相關類型的元素，設定相同的 class 屬性，然後以 . 為字首，連結 class 屬性名稱，例如 .cls_a ，如此一來，相同 class 屬性名稱的元素，都會套用指定的樣式，此為類別選擇器，請自行點選右邊畫面上任一個灰色方塊以檢視畫面左邊的效果。

P.S. 此範例調用 querySelector() 與 querySelectorAll() 等 HTML5 導入的功能函式，IE不支援，請改用 Chorme 或是 Firefox