美文网首页
CSS3--transform方法

CSS3--transform方法

作者: 八月飞花 | 来源:发表于2020-06-07 10:02 被阅读0次

    介绍

    transform是css3的属性,经过transform设置的属性可以被GPU加速,同时改变样式不会触发渲染阶段的回流
    

    常用方法

    rotate

    这个方法主要是负责元素的旋转设置的,默认单位deg(角度),+顺,-逆
    rotate方法是一个复合函数,内部可以防止1到两个参数
    rotate3D(x,y,z)分别代表三个轴的旋转角度
    设置方式
    transform:rotate(10deg,20deg);//x旋转10度,y旋转20度
    

    perspective

    perspective:这个函数,时设置井深的,景深就是近大远小,单位px,等距离单位
    

    skew:斜切

    斜切:沿着某个边,将举行拉伸成平行四边形,
    skew(30deg);//表示举行左上角和右下角和Y轴呈现一个30度的夹角,
      正值:拉左上角和右下角
      负值:拉右上角和左下角
    skewX(),与Y夹角
    skewY();与X夹角
    

    相关文章

      网友评论

          本文标题:CSS3--transform方法

          本文链接:https://www.haomeiwen.com/subject/egypmhtx.html