transform属性

一：基础：

  <style>
  /*旋转  缩放(1是正常)  倾斜,移动(先水平，后垂直)*/
  div{
    width: 300px;
    margin: 150px auto;
    background: #00aaff;
    text-align: center;
  /*  transform:rotate(45deg);
    --webkit-transform: rorate(45deg);*/
    /*transform:scale(2);*/
    /*transform:skew(0,30deg);*/
    transform:translate(250px,250px);
  }
  </style>

transform:skew(30deg,0);

二：对一个元素使用多种变换方法

transform:translate(250px,250px) rotate(30deg) scale(2) skew(30deg,0);

注意顺序不同，效果可能也会不同的~

三：改变基准点

transform-origin  属性值： top/bottom right/left center

版权声明：本文为博主原创文章，未经博主允许不得转载。