2012年9月，W3C发布了CSS3变形工作草案（http://www.w3.org/TR/css-transforms-1/）。CSS3变形允许CSS把元素转变为2D 或3D空间，这个草案包括了CSS3 2D变形和CSS3 3D变形。
CSS3变形是多种效果的集合，如旋转、缩放、平移和倾斜等，每个效果都被称作为变形函数，它们可以操控元素发生旋转、缩放、平移和倾斜等变化。在CSS3之前，实现类似的效果都需要图片、Flash或JavaScript才能完成。而使用纯CSS来完成这些变形则无需加载这些额外的文件，提升了开发效率，提高了页面的执行效率。
CSS3变形包括3D变形和2D变形，3D变形使用基于2D变形的相同属性，如果了解了2D变形，会发现3D变形与2D变形的功能类似。
CSS 2D Transform获得了各主流浏览器的支持，但是CSS 3D Transform支持程度不是很完善。考虑到浏览器兼容性，3D变形在实际应用时应添加私有属性，并且个别属性在某些主流浏览器中并未得到很好的支持，简单说明如下：
- 在IE10+中，3D变形部分属性未得到很好的支持。
- Firefox10.0至Firefox15.0版本的浏览器，在使用3D变形时需要添加私有属性-moz-，但从Firefox16.0+版本开始无需添加浏览器私有属性。
- Chrome12.0+版本中使用3D变形时需要添加私有属性-webkit-。
- Safari4.0+版本中使用3D变形时需要添加私有属性-webkit-。
- Opera15.0+版本才开始支持3D变形，使用时需要添加私有属性-webkit-。
- 移动设备中iOS Safari3.2+、Android Browser3.0+、Blackberry Browser7.0+、Opera Mobile24.0+、Chrome for Android25.0+都支持3D变形，但在使用时需要添加私有属性-webkit-；Firefox for Android19.0+支持3D变形，但无需添加浏览器私有属性。
transform包含多个子属性，用来设置变形参数，简单说明如下，详细用法请参考CSS3参考手册。
- transform-origin：设置2D或3D变形原点。CSS变形的原点默认为对象的中心点（50% 50% 0），3D变形中Z轴的值默认为0。
- transform-style：设置CSS变形的类型，取值包括flat（2D平面变形，为默认值）和preserve-3d（3D立体变形）。
- backface-visibility：设置3D变形中背面的元素是否可见，默认为可见。
- perspective：定义3D变形中透视距离，它应用在变形元素的父级或祖先级元素上。而透视函数perspective()是transform变形函数的一个属性值，可以应用于变形元素本身。