transform 设置元素的变形，可以设置一个或多个以上的变形元素 目前包括以下五个函数
translate(x,y) 元素向x，y轴移动
rotate(angle) 元素选择angle角度， angle单为为deg
scale(x,y) 表示元素缩放比
skew(anglex,angley) 元素x，y倾斜角度
matrix(a,b,c,d,x,y) 将旋转，缩放，移动，倾斜组合在一起
transform-origin： 表示元素旋转的中心点，默认值为50%，50%
<!DOCTYPE html> <html> <head> <style> #div1 { position: relative; height: 200px; width: 200px; margin: 100px; padding:10px; border: 1px solid black; } #div2 { padding:50px; position: absolute; border: 1px solid black; background-color: yellow; transform: rotate(45deg); transform-origin:20% 40%; -ms-transform: rotate(45deg); /* IE 9 */ -ms-transform-origin:20% 40%; /* IE 9 */ -webkit-transform: rotate(45deg); /* Safari and Chrome */ -webkit-transform-origin:20% 40%; /* Safari and Chrome */ -moz-transform: rotate(45deg); /* Firefox */ -moz-transform-origin:20% 40%; /* Firefox */ -o-transform: rotate(45deg); /* Opera */ -o-transform-origin:20% 40%; /* Opera */ } </style> </head> <body> <div id="div1"> <div id="div2">HELLO</div> </div> </body> </html>