介紹

　　選擇器用於找到HTML標籤

分類

　　1. 標籤選擇器：用HTML標籤名作選擇器

　　使用

p { color : red; font-siez : 12px }

　　2. id選擇器：用“#”作表示，後跟HTML標籤id屬性值。一張頁面中的HTML標籤的id值唯一。

<div id="mydiv"> HTML5開發 <div>

#mydiv { color : red ; font-size : 12px; }

　　3. 類選擇器：用"."作表示，後跟HTML標籤class屬性值。類選擇器讓同class屬性值的標籤有相同樣式。

<div class="mydiv"> HTML5開發 <div>

.mydiv 
 
{ color : red ; font-size : 12px }

　　4. 限定選擇器：查詢HTML5標籤下限定的選擇器。由兩個選擇器構成，前者是類選擇器，後者id選擇器或類選擇器

<div id="mydiv" class="myclass"> HTML5開發 <div>

 
 div.myclass { color : red; font-size : 12px; }
 div#mydiv { color : red; font-size : 12px;}
  

　　5. 後代選擇器：用於選擇HTML標籤後代。父元素在前，子元素在後，中間一個空格

div p 
 
{....}
duv #mydiv {....}
ul li a {......}
p .myclass {......}

　　6. 並集選擇器：用逗號將多個選擇器同時組合

div,p,#mydiv,ul {......}

　　7. 偽類：為將發生某類動作的標籤設定樣式

/*  選擇滑鼠懸停的a標籤 */
a:hover { color : #ff6700; }

/* 選擇獲取焦點的a標籤 */
a:focus { color : #ff6700; }

/* 選擇第n個孩子 */
ul:nth-child(n) {.....}

/* 選擇倒數第n個孩子 */
ul:nth-last-child(n) 
 
{......}