CSS选择器

1. id选择器

     
      
      
      
       我是一个盒子——块状模型
      
     

 注意：id选择器，在<style>中，在属性名前应加上一个“#”号，代表引用。

2.class选择器

     
      
      
      
       我是第一个盒子
       
        我是第二个盒子
        
         我是第三个盒子，样式跟第一个盒子一样
        
       
      
     

 注意：class选择器，在<style>中，在属性名前应加上一个“.”号，代表引用。

  温馨提示：

     id选择器和class选择器的区别：id名称是文档唯一且不可重复出现的，

    class选择器名称是可重复使用的，因此也称为类选择器。

3.标签选择器

 顾名思义，是根据标签名字来进行匹配样式的选择器。

     
      
      
      
       块
      
      
       块
      
      
       块
      
      
p1
      
p1
      
p1
     

4.群组选择器

     
      
      
      
       块
       
        块
        
         块
        
       
      
     

5.包含选择器

     
      
      
      
       
p1
      
      
       
p2
  
         
p3
  
      
      
       块
      
      
p1
      
p1
      
p1
     

 不难看出，包含选择器中，只有在div里面的span中的p标签的内容才有变化。

6.通配符

     
      
      
      
       
我是小倩加油站~~
      
      
       
哎呦喂
  
         
嘿嘿嘿~
  
      
      
       干巴爹~
      
      
哎呀~
      
嘻哈~
      
哟哟~
     

7.选择器优先级

 前面介绍了这么多选择器，接下来该说说这些选择器的优先级，如果在同一文档中出现不同的选择器，应该表现何种样式，于是优先级就诞生了。

 选择器优先级

    标签选择器  <  class选择器  <  id选择器  <  style行间样式 < js

 温馨提示：

    如果同样的选择器出现文档中，默认后者覆盖前者的选择器，则表现为后面选择器的样式。