转换 - transform

移动 - translate

image.png

案例- 利用transform水平居中

image.png

旋转 - rotate

image.png

案例 - 旋转的三角

image.png
image.png

旋转中心 - transform-origin

image.png

缩放 - scale

中心的用transform-origin
image.png

综合写法

image.png

过渡 - transition

定义和用法

transition 属性是一个简写属性，用于设置四个过渡属性： 默认值 transition : all 0 ease 0
transition : all 1s linear;

值 描述
transition-property 规定设置过渡效果的 CSS 属性的名称。
transition-duration 规定完成过渡效果需要多少秒或毫秒。
transition-timing-function 规定速度效果的速度曲线。
transition-delay 定义过渡效果何时开始。