1，transition:過渡（是一個(gè)簡寫的屬性，用于設(shè)置四個(gè)過渡的屬性）；

transition-property:設(shè)置過渡效果的css屬性的名稱；

默認(rèn)值是all；

transition-duration:設(shè)置完成過渡效果需要多少時(shí)間單位用秒來表示；

默認(rèn)值是0s，這個(gè)屬性一定要寫，因?yàn)?s沒有時(shí)間，就沒有過渡的效果；

transition-function:設(shè)置過渡效果的速度曲線；

默認(rèn)值是ease（慢速開始，然后變快，然后慢速結(jié)束的過渡效果）；

ease-in(慢速開始，然后變快，然后慢速結(jié)束的過渡效果);

ease-out(規(guī)定以慢速結(jié)束的過渡效果);

ease-in-out(以慢速開始和結(jié)束的過渡效果);

linear(以相同速度開始至結(jié)束的過渡效果);

cubic-bezier(n,n,n,n);定義自己的值，可以設(shè)置任意值；正負(fù)值皆可；

transition-delay:設(shè)置過渡的延遲；

transition的簡寫方式：

transition：transition-property transition-duration transition-function transition-delay；

2，transform：變形；（只對block元素生效）

transform屬性允許你修改CSS視覺格式模型的坐標(biāo)空間。使用它，元素可以被位移（translate）、旋轉(zhuǎn)（rotate）、縮放（scale）、傾斜（skew）；

translate位移：

translateX：元素在x軸上偏移；

translateY：元素在Y軸上偏移；

translate（x，y）：元素在x軸和y軸同時(shí)偏移，如果只設(shè)置一個(gè)值的時(shí)候，那么只有x軸生效；

rotate旋轉(zhuǎn)：

rotateX:元素繞著x軸旋轉(zhuǎn)；

rotateY:元素繞著Y軸旋轉(zhuǎn)；

rotateZ:元素繞著Z軸旋轉(zhuǎn)；

rotate：元素繞著Z軸旋轉(zhuǎn)；

scale：縮放：

scaleX? 設(shè)置元素在X軸方向縮放比例

scaleY? 設(shè)置元素在Y軸方向縮放比例

scale（x，y）? 設(shè)置元素在x軸和y軸方向的縮放比例，只設(shè)置一個(gè)值的時(shí)候，x軸和y軸都生效；

skew：傾斜；

skewX 元素繞x軸傾斜；

skewY 元素繞著Y軸傾斜；

skew（x，y）元素繞著x軸和Y軸傾斜，不過這里的x軸和Y軸是和平時(shí)相反的，常用于平行四邊形；

transform-origin：設(shè)置元素變化的中心點(diǎn)（原點(diǎn)）；

可以設(shè)置兩個(gè)值：transform-origin：x，y；

x可以支持的屬性值：px 百分比 left center right；（可以設(shè)置負(fù)值）；

y可以支持的屬性值：px 百分比 top center bottom；（可以設(shè)置負(fù)值）；