CSS_动画_3d

 1.二级菜单的动态效果，添加动画

        display是不参与过渡的，=====使用高度 给高度加过渡

        2.过渡：transition:all 3s linear

        3.2d平面效果：缩小，放大，平移：transform

        过渡和平面效果属于动画的一种，他们两个需要鼠标的事件才能去触发对应的效果

        有没有一种动画效果直接不要鼠标事件就能完成的===真正意义上面的动画属性

        4.animation：真正意义上面的动画，不需要触发鼠标事件就直接能完成

           使用方法

           animation：name  3s   linear   5s   infinite   alternate\

           name==========声明动画的名字

           3s============动画执行的时长

           linear========动画执行的类型

           5s============动画延迟执行时间

           infinite======一直执行   换成一个数字，执行次数

           alternate=====反复执行，缓慢的开始缓慢的结束  前提：次数要么是无限循环，要么是偶数

           声明动画（声明关键帧动画）

           方法1

           @keyframes  name{

               form{

                   从........开始====开始状态

               }

               to{

                   到达......结束====结束状态

               }

           }

           方法2：关键帧动画 定义所有的帧

           百分比称之为关键帧

           @keyframes   name{

               0%{

                   开始状态

               }

               50%{

                   中间状态

               }

               100%{

                   结束状态

               }

           }