css样式学习

1  在head标签中写

   

2 id选择器 一个页面绝对不能有相同id,一个标签可以被多个选择器设置

段落1

段落2

段落3

3 class选择器，可以重复，任何标签都可以携带class。一个标签可以包含多个类。不能一个标签写多个class。类：公共样式提取出来，重复利用。

.para{
        color: red;

        }

.zhongyao{
        text-decoration: underline;

        }

段落1

段落2

类上样式，id上行为。类选择器主要调样式，id主要给js调动画用

4 后代选择器 类选择器可以空格代表后代选择器

       

           
•  
                 

  段落

    
                 

  段落

  
                 

  段落

  
             

             
• 
                 

  段落

  
                 

  段落

  
                 

  段落

  
             

       

   

5 交集选择器，交集选择器没有空格,交集选择器可以连续交(兼容到IE8),交集选择器，我们一般都是以标签名开头

IE： 微软的浏览器，随着操作系统安装的。所以每个windows都有IE浏览器。
windows xp 操作系统安装的IE6
windows vista 操作系统安装的IE7
windows 7 操作系统安装的IE8
windows 8 操作系统安装的IE9

windows10 操作系统安装的Edge

浏览器兼容问题，要出，就基本上就是出在IE6、7身上，这两个浏览器是非常低级的浏览器

浏览器的市场占有率： http://tongji.baidu.com/data/

       

           
•  
                 

  段落

    
                 

  段落

  
                 

  段落

  
             

             
• 
                 

  段落

  
                 

  段落

  
                 

  段落

  
             

       

   

   

       

段落

       

段落

       

段落

   

6  并集选择器，用逗号分开

       

段落

       

段落

       

段落

   

   

       
• li

       
• li

   

7 儿子选择器，IE7开始兼容

 div>ul{
        color: red;

       }

       

           
• li

           
• li

       

   

8 序选择器 

 ul li:first-child{
        color: red;

       }

       

           
• li

           
• li

       

   

对于不兼容的用class代替

       

           
• li

           
• li

       

   

9 下一个兄弟选择器

h3+p{
        color: red;

       }

 

       

h3

       

段落

       

段落

       

段落

   

未完待续。。。。。。