17.Css——过渡

Css过渡

具体用法如下：

<style type="text/css">

p{

       width:100px;                                                       

       height:100px;                                                      

       background-color:black;                                     

}                                                                                

  【此时利用一个冒号选择器，将长100宽100 的黑色矩阵在戍边划过的瞬间变成长200宽200的橙色矩阵，在冒号中添加属性，

   改变变换时候的模式。】

p:hover{

       width:200px;

       height:200px;

       background-color:orange;

transition-delay:500ms;   延迟时间，即需要500ms的时间才能触发这个反应

transition-duration:500ms;  间接过渡，即完成这个转换需要时间是500ms

-webkit-transition-duration:_;  为了让谷歌和Safari浏览器能够正常使用

-o-transition-duration:_;欧朋浏览器

-moz-transition-duration:_;火狐浏览器

-ms-transition-duration:_;IE浏览器

transition-property:background-color; 长度瞬间完成变换，颜色缓慢

                             :width；宽度慢慢变换，长度和颜色瞬间完成变换

transition-timing-function: ease;开始慢后来快

                                         ease-in;开始快后来慢

                                         ease-out;很快很快原来越慢

                                         ease-in-out;前面后面快，中间比较慢

                                         liner;

}