发表于: 2018-11-05 22:12:46

1 637


今天学到的东西

                 1       完成任务7

                 2      今天学到的知识
     
                     1    transition   
    

           一。
                   transition  
                         用法
                                 。类名{
                                               -moz-transition:height 3s;
                                              -webkit-transition: height 3s
                                             -o-trsition: height 3s;
                                                                                       }
                    .transition-property
                   .transition-duration
                   .transition-timing-function
                  .transition-delay
                  transion-propety
                

                      作用   规定设置过度效果 css属性的名称    
                    

                     属性
                                none    没有效果
                                 all      所有的都有效果
                               属性名   定义应用过度效果 的css的属性名称列表 列表逗号 分割

             transitionon-duration
                  作用 : 规定完成过度效果需要多少秒  或者  毫秒
         
                  属性   
                   time    规定 完成过度效果需要花费的时间   (秒  毫秒)
          transition-timing-function
                 作用  规定 过度效果的速度曲线
                  属性
                        linear     规定相同速度开始结束的过度效果
                       ease       慢速开始   然后变快 然后慢速结束
                      ease-in    慢速开始
                      ease-out   慢速结束
                     ease-in-out 慢速开始和结束
        transition-selay
           作用  规定合适将开始 切换效果
       属性      time        制定时间    之前要等待切换效果开始 (单位 秒  毫秒)


          总结
         类名----hover(动作)-----transition-property(加过度)----transitionon(设定时间)---transitionon-timing-function(速度)----               transition-delay(延迟动作)

      简写   顺序不能乱
             transition:   property    duration   timing-function   delay

计划明天的事

             2    浏览器内核
             3    animation



返回列表 返回列表
评论

    分享到