CSS3的一些新特性

   1 box-sizing

   （1）box-sizing: border-box;

    所设置的width和height包括padding和border

 

   （2）box-sizing: content-box;

    所设置的width和height不包括padding和border，只对content。

 

   2 background-clip

   （1）background-clip: border-box;

    整个盒模型（content+padding+border）都有背景

 

   （2）background-clip: padding-box;

    （content+padding）有背景

 

   （3）background-clip: content-box;

    content有背景

 

   3 background-origin

   （1）background-origin: border-box;

    从盒模型的border的左上角开始显示背景；

 

   （2）background-origin: padding-box;

    从盒模型padding的左上角开始显示背景；

 

   （3）background-origin: content-box;

    从盒模型content的左上角开始显示背景；

 

   4 background-size: wwpx hhpx;

    设置背景的大小

 

   5 旋转

    设置旋转的角度：

    transform: rotate(90deg);

 

    设置旋转的圆心：

    transform-origin: center center

 

    缩放：

    scale：

    scaleX:

    scaleY:

    scaleZ:

 

    移位：

    transform: translate(50px, -4em);