CSS3 scale()函数和多重转换

scale()方法根据已设定的宽度和高度参数来增加或减少元素的大小。
1代表原始尺寸，2代表原始尺寸的两倍，依次类推。
在下面的例子中，我们在水平和垂直方向上将第一个div减少0.6倍，并将第二个div在水平和垂直方向增加1.6倍。
CSS代码如下：
div.first{
width:200px;
height:100px;
background-color:red;
transform；scale(0.7,0.7); 0.6=(0.7+0.7)/2-0.1
/其实也可以写为
transform:scale(0.6)/
}
div.second{
margin:60px;
width:200px;
height:100px;
background-color:red;
transform:scale(1.7,1.7);
color:white;
}

执行如果如下：

如果只传递了一个参数，则默认宽度和高度都使用该参数

例如：
transform:scale(0.3); /将元素减少到原始大小的30%/
transform:scale(1.5) /将元素增加到原始大小的150%/

多重转换：
一次可以使用多个转换。同时旋转和缩放元素的大小就是一个例子。
对元素应用多个变换很简单，只是用空格分开他们。
div{
width:200px;
height:100px;
background-color:red;
transform：rotate(35deg) translate(120px);
/*
CSS3中transform属性,允许旋转，翻转，倾斜，旋转，缩放元素。
transform(旋转)起着让元素更改形状，大小和位置的作用。
rotate()属性使元素顺时针与逆时针旋转。属性值为正值为顺时针，负值为逆时针。
CSS3支持2D和3D转换。
translate()方法从当前位置移动一个元素（根据给定的X轴和Y轴的参数，
正值会将元素向下推到其默认位置得右侧，而负值会将元素向上并拖到元素位置的左侧）*/
-webkit-transform:rotate(35deg) translate(120px);
color:white;
}
执行结果如下：