標籤選擇器

選擇器的功能：

    選中要新增樣式的標籤元素。
    什麼是標籤選擇器？
    通過標籤名直接選擇相應的標籤。
    不管有多複雜的巢狀關係，標籤的位置就算藏得很深，依然可以被標籤選擇器命中。

    格式：標籤名{
        宣告;
    }
    標籤選擇器的作用：
        1.利用標籤選中所有的特性，進行預設樣式的清除。
        2.複雜選擇器中一部分使用。

eg:

我是段落3

我是一級標題

我是段落

我是段落2

• 
  
• 我是li
• 
  

ID選擇器

ID選擇器作用：
選中頁面中唯一的一個標籤。

    格式：#ID值{
        宣告;
    }
    【注】：
    1.id值必須是唯一的，在一個頁面中只能出現一次。如果多次出現重複的ID值是不符合規範的。
    2.所有的標籤都有ID屬性。ID命名的規範：由字母，下劃線，中劃線，數字組成。不能以數字開頭。
    3.見名知意。不要起毫無意思的名字。
    4.駝峰寫法：SearchButton(大駝峰) searchButton(小駝峰，推薦) 多個單詞，從第二個單詞開始，每個單詞的首字母大寫。
    5.下劃線寫法：search_button   多個單詞，從第二個單詞開始，每個單詞的前面新增一條下劃線。
    【注】：id選擇器儘量不要在css中使用，而是配合js使用。
 

年輕人不講武德

我大意了沒有閃

類選擇器

類選擇器：
通過標籤中的class屬性來選擇標籤

    格式：
    .class值{
        宣告;
    }
    優點：可以選擇一部分標籤，設定相同的樣式。
    【注】
    1.class值可以不唯一。類選擇器選中的是擁有相同class值得標籤元素。
    2.一個標籤可以擁有多個class值。
    3.命名規則與ID相同。

    類上寫樣式，ID寫行為。
-->

年輕人不講武德

我大意了沒有閃

後代選擇器

後代選擇器：

通過標籤的巢狀關係，來縮小選擇範圍，在範圍內查詢相關的元素。

格式：選擇器1  選擇器2{
    宣告;
}
選擇器1必須是選擇器2的祖先元素。 
IE7開始相容，IE6不相容。
【注】
1.定義時，選擇器之間使用空格隔開。空格左側必須是右側的祖先元素。
2.當要把某些元素中的某些元素進行樣式修改時，就要想要使用後代選擇器。
-->

我是span標籤

我是span標籤3

子代選擇器

子代選擇器：

通過標籤間的巢狀關係，來選中相應標籤的子元素。
格式：
選擇器1>選擇器2{
    宣告;
}
【注】>左右兩邊的關係必須是父子關係。

-->

我是span標籤

我是span標籤3

交集選擇器

交集選擇器
既滿足條件1，又滿足條件2.
格式：
選擇器1選擇2{
宣告;
}
【注】
1.交集選擇器如果是標籤選擇器與類選擇器的混寫，則必須將標籤選擇器放在前面。
2.連續交集 既滿足條件1，又滿足條件2，還滿足條件3.

我是span標籤

我是span標籤3

並集選擇器

交集選擇器
既滿足條件1，又滿足條件2.
格式：
選擇器1選擇2{
宣告;
}
【注】
1.交集選擇器如果是標籤選擇器與類選擇器的混寫，則必須將標籤選擇器放在前面。
2.連續交集 既滿足條件1，又滿足條件2，還滿足條件3.

我是span標籤

我是span標籤3

序選擇器

序選擇器
first-child
判斷當前元素是否為父元素的第一個子元素，如果是，則選中。
last-child
判斷當前元素是否為父元素的最後一個子元素，如果是，則選中。
only-child
判斷當前元素是否為父元素的唯一一個子元素，如果是，則選中。
–>
//

• 
  
• 我是第一個li
• 
  
• 我是第二個li
• 
  
• 我是第三個li
• 
  
• 我是第四個li
• 
  
• 我是第五個li
• 
  

• 我是第一個li
• 我是第二個li
• 我是第三個li
• 我是第四個li
• 我是第五個li

相鄰選擇器

序選擇器
first-child
判斷當前元素是否為父元素的第一個子元素，如果是，則選中。
last-child
判斷當前元素是否為父元素的最後一個子元素，如果是，則選中。
only-child
判斷當前元素是否為父元素的唯一一個子元素，如果是，則選中。
–>

• 我是第一個li
• 我是第二個li
• 我是第三個li
• 我是第四個li
• 我是第五個li