码迷,mamicode.com
首页 > Web开发 > 详细

CSS3

时间:2016-12-04 00:52:17      阅读:307      评论:0      收藏:0      [点我收藏+]

标签:str   ast   lin   nbsp   插入   技术   优化   png   样式   

CSS3

CSS3  =   CSS2  +  新语法             对css2进行的扩充、删减、优化

  选择器:  标签选择器   类选择器  id选择器

    属性选择器

      E---element元素   data---属性

      <标签  属性="属性值"  ></标签>-----html元素  

      E[data]        选择带有data的元素对象,给该元素对象加样式

      E[data="one"]     选择带有data的元素对象,并且属性值等于one的加样式     

      E[data^="o"]     选择带有data的元素对象,并且属性值以o开头的加样式         ^ ----开头

      E[data$="e"]      选择带有data的元素对象,并且属性值以e结尾的加样式      $ ----结尾        

             E[data*="n"]      选择带有data的元素对象,并且属性值包含n的加样式         * ----包含

          技术分享

 

    伪类结构  

       E:first-child{}                   第一个孩子加样式   

       E:last-child{}                   最后一个孩子加样式

       E:only-child{}                    只有一个孩子(独生子)的加样式                      

       E:nth-child(n){}                     第n个孩子加样式    n=1 2 3 4 5 .....

       E:nth-child(2n+1){}/E:nth-child(odd){}       奇数孩子加样式    n=1 3 5 7 .....                  

       E:nth-child(2n){}/E:nth-child(even){}       偶数孩子加样式         n=2 4 6 8 ....                        

                  

       技术分享

 

   伪元素          

     E:first-letter{}        设置第一个文字

     E:first-line{}                         设置第一行文字      

     E::after{}            往盒子里面插入内容 ,插在在盒子里面的后面

     E::before{}                 往盒子里面插入内容 ,插在在盒子里面的最前面                                                                                

     技术分享        技术分享

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

CSS3

标签:str   ast   lin   nbsp   插入   技术   优化   png   样式   

原文地址:http://www.cnblogs.com/strive-for-life/p/6129921.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!