transform的含义是：改变，使…变形；转换

代码:

 

 

 

效果

 

 

 

拓展:

1.旋转rotate

rotate：通过指定的角度参数对原元素指定一个效果。
如果设置的值为正数表示顺时针旋转，如果设置的值为负数，则表示逆时针旋转。如：transform:rotate(30deg)；

 

2.移动translate

translate() 根据左(X轴)和顶部(Y轴)位置给定的参数，从当前元素位置移动。

如：transform:translate(100px,20px):

 

3.缩放scale

缩放scale和移动translate是有点相似的，也是有三种情况：下面我们具体来看看这三种情况具体使用方法：
注意：默认值是1，它的值放大是比1大，缩小比1小。