transition-property 指定过渡动画的属性 transition-duration 过渡时间，正值且必须带单位（包括0） transition-timing-function 过渡动画的形式，默认值为ease transition-delay 过渡延迟 Transitionend 每个事件完成时都会触发此事件 当属性值的列表长度不一样时 超出的情况会被裁剪 不够的情况，关于时间的会重复列表
简写属性推荐顺序： 过渡时间，过渡样式，过渡形式，延迟时间[，过渡时间，过渡样式，延迟时间] 2.变换 （1）2D变换transform:允许你修改css视觉格式模式的坐标空间，只对block级元素生效。 旋转（rotate） 平移（translate） 倾斜（skew） 缩放（scale） 基点的变换：transform-origin :改变一个元素变形的基点 矩阵matrix（需知道勾股定理，三角函数，角度与弧度的转换）：旋转,平移,倾斜,缩放. 变换组合时，方向从右向左，就是矩阵的计算
top,height，left,margin,padding,width 百分比参照于包含块的高度 translate(-50%,-50%) 百分比参照于自身的高度 background-position 百分比参照于（图片区域-图片的位图像素值）的高度
（2）3D变换:旋转,平移,缩放 景深perspective：肉眼到屏幕的距离。 写法（2种）： css属性 transform属性的一个变换函数（必须是第一位） 作用： 让3D场景有近大远小的效果，是一个不可继承属性，但可作用于元素后代（不作用于本身）。 景深基点perspective-origin：视角的位置,默认值为50%。 景深叠加
灭点：景深越大，灭点越远，元素变形越小。 transform-style：构建具有层级的3d舞台，作用于子元素。不可继承。 Backface-visibility 隐藏元素背面 一个元素分两面，元素没有厚度。在一个状态下，元素只能展示自己的一面
！！百分比参照于谁？ 元素垂直水平居中方案： 已知高宽：（伪代码） 1.position=absolute,lrtb=0,margin=auto,包含块一定的容器。 绝对定位盒模型的特性：margin为auto Left+right+width+padding+margin=包含块宽度 Top+bottom+height+padding+margin=包含块高度 2.position=absolute,lt=50%,包含块一定的是容器，marginT/L为负的自身的一半 3.position=absolute,lt=50%,包含块一定的是容器，transform:translate3d(-50%,-50%,0) 4.flex 未知高宽： 1. position=absolute,lt=50%,包含块一定的是容器，transform:translate3d(-50%,-50%,0) 2.flex Img元素如何垂直水平居中： 1.基线
（3）3D动画 动画内的属性： animation-name：关键帧的名字 关键帧： @keyframes animationName{ Keyframes-selector{ Css-style; } } Keyframes-selector可以是关键帧from(0%)到to()100% 百分比（时间的节点）
animation-duration一个动画周期的时长 animation-timing-function作用于动画内的属性（关键帧）
动画外的属性 animation-delay
只作用于动画内的属性（关键帧） animation-iteration-count:循环关键帧的次数 animation-direction animation-fill-mode：管理所有动画外的状态 animation-play-state：动画的运动和静止;
什么是动画外的状态： From之前 Aniamtiojn-delay To之后 值： none:动画外的状态保持在动画之前的位置 backwards:from之前的状态与from保持一致 forwards:to之前的状态与to持一致 botn：backwards+forwards
