css3系列之transform
transform(变形)是CSS3中的元素的属性
transform的属性值主要包括旋转（rotate）、扭曲（skew）、缩放（scale）和移动（translate）以及矩阵变形（matrix）
translate：参考自己的位置进行平移
translateX
向X轴平移，填正数往右平移，填负数，往左平移
translateY
向Y轴平移，填正数往下平移，填负数，往上平移
translate(x,y) 定义2D变换
translate3d(x,y,z) 定义 3D 转换
可以利用该属性达到水平垂直居中的效果
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)title>
<style>
.parent{
position:relative;
width:200px;
height:200px;
background-color:blue;
}
.child{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
height:50%;
width:50%;
background-color:green;
}
style>
head>
<body>
<div class="parent">
<div class="child">div>
div>
body>
html>
scale:缩放
scale(x,y) 定义 2D 缩放转换
scale3d(x,y,z) 定义 3D 缩放转换。
rotate:旋转
rotate(angle) 定义 2D 旋转，在参数中规定角度
rotate3d(x,y,z,angle) 定义 3D 旋转
skew:扭曲
skew(x轴angle,y轴angle) 定义沿着 X 和 Y 轴的 2D 倾斜转换。
matrix:矩阵变形
matrix(n,n,n,n,n,n) 定义 2D 转换，使用六个值的矩阵
matrix3d(n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n) 定义 3D 转换，使用 16 个值的 4x4 矩阵