zoukankan      html  css  js  c++  java
  • css3 -- 2D变换

    1、transform

    1 E{
    2     -moz-transform:function(value);  
    3     -ms-transform:function(value); 
    4     -o-transform:function(value); 
    5     -webkit-transform:function(value); 
    6     transform:function(value);
    7 }

    2、旋转

    1 h2{transform:rotate(-25deg);}

    原始的,转换前的元素会保持它在文档流中的位置,所以后续的所有元素都会受到它的影响,经过变换的元素并不影响页面的布局,但它会位于页面剩余部分之上的一个新层次上,这就意味着这个新的元素可以覆盖后续的元素

    3、变换原点

    1 E{transform-origin:0 0 ;}

    4、平移

    1 E{
    2    transform:translateX(value);
    3    transform:translateY(value);
    4 }
    5 E{transform:translate(translateX,translateY);}

    经过变换的元素会保留它本身的位置

    5、倾斜

     E{
        transform:skewX(value);
        transform:skewY(value);
     }
     E{transform:skew(skewX,skewY);}

    6、缩放

    1  E{
    2     transform:scaleX(value);
    3     transform:scaleY(value);
    4  }
    5  E{transform:scale(scaleX,scaleY);}
    6 使用负值的效果就是垂直的翻转元素
  • 相关阅读:
    登录界面
    动手动脑
    关于二进制
    Java考试
    D
    威尔逊定理 k!%p
    11.46.2020质检
    最长上升序列输出方案
    问题 G: 汽车的最终位置
    奶牛大会(二分)
  • 原文地址:https://www.cnblogs.com/zhanghuiyun/p/5539405.html
Copyright © 2011-2022 走看看