transform
translate 移动 translate(10px,100px)要配合过渡或动画才有意义
transition-delay()过渡延迟时间
transition-timing-function:线性过度
transition-property:all;元素参与的属性,all表示全部
rotate 顺时针旋转 负数是逆时针 rotate(45deg)
scale 放大缩小 transform: scale(1,1); x轴 y轴 放大缩小比例
matrix()[组合操作]六个参数一起操作
.div:hover{
transform: skew(30deg 30deg);
transition-property: all;
transition-duration: 3s;
transition-timing-function: linear;
}
anmation
动画 它的属性有：
animation-name 动画名
animation-duration 动画时间
animation-timing-function 方式（linear匀速 ease加速再减速 ease-in加速 ease-out减速 ease-in-out低速开始和结束 ）
animation-delay 动画开始前延迟时间
animation-iteration-count 动画次数
animation-direction 是否反向
@-浏览器-keyframes 名称{
from{}to{}
}
.div{
height: 100px;
width: 100px;
background: red;
margin-left: 200px;
margin-top: 200px;
float: left;
position:relative;
}
div{
animation:aa 2s infinite;
}
@keyframes aa
{
from {left:0px;}
to {left:200px;}
}
<div class="div">11</div>
div{
width: 100px ;
height: 100px;
background: red;
/*position:relative;*/
animation: aa 2s linear infinite;
}
@keyframes aa {
0%{
transform: translate(0 0);
}
100%{
transform:tr