今日学习内容：
css的2d转换
属性transform
transform:translate(x,y);对盒子进行x轴和y轴的位移
transform:translatex();对盒子x轴的位移
transform:translatey();对盒子y轴的位移
注意点
translate不会影响其他元素的位置
translate中的百分比单位是相对于元素自身的宽高来说的，比如translate（50%，50%）
2d转换角度问题
transform:rotate(度数)
度数的单位是deg，度数
2d转换中心点
transform-0rigin:x,y;
1.方位名词控制中心点top， right，bottom 等
2.利用具体的像素单位来设置转换中心点
2d转换的缩放
transform: scale(x,y);给x和y轴进行缩放
transform: scale(2,2);代表宽高各放大二倍
transform：scale（3);
scale和width/height设置盒子大小的区别
1.scale和width/height设置宽高时，上沿不动，只向下来改变自己的宽和高；
2.scale进行缩放是，默认以盒子中心点为准进行缩放，并且不会影响其他盒子
css的动画
动画序列
0%代表动画的开始100%代表动画结束，这样的规则就叫做动画序列
在@keyframes中规定动画以及css的样式，keyframes叫做关键帧
我们在动画序列中就可以设置任意多的样式，任意多的次数
可以用百分比来规定变化的时间，或者使用关键字“from” 和“to”，等同于0%~100%
动作制作的步骤
1.定义动画
2.调用动画
动画的常用属性
@keyframes 规定动画
animation 动画的复合属性
animation-name 调用动画的名称（必须值）
animation-duration 规定动画完成一个周期所花费的时间秒、毫秒都可以，默认是0 （必须值）
animation-timing-fuction 规定动画的速度曲线，默认是ease
animation-delay 规定动画何时开始，默认是0
animation-iteration-count 规定动画的播放次数，默认是1，无线循环是infinite
animation-direction 规定动画是否在下一个周期逆向播放，默认是normal，逆向播放alternate
animation-play-state 规定动画是否正在运行，默认值是running 暂停是paused。
animation-fill-mode规定动画结束后的状态，保持结束的状态是forwards回到最初状态backwards
注意点：
1.复合属性中不包括animation-play-state
2.暂停动画一般和鼠标经过（hover）等其他属性进行配合使用
今日遇到的问题：无
|
