zoukankan      html  css  js  c++  java
  • scale()函数

    CSS中的scale()函数用来改变元素的大小。

    可以通过向量形式定义的缩放值来放大或缩小元素,也可以在不同的方向设置不同的缩放值。

    该变换通过一个二维向量确定在一个方向缩放的多少。

    如果缩放向量的两个坐标是相等的,那么缩放是均等的,或者说是各向同的,同时元素的形状是被保持的。这种情况下进行的是位似变换。

    当坐标值处于区间 [-1, 1] 之外时,该变换将在相应的坐标方向上放大该元素,当处在区间之中时,该变换将在相应的坐标方向上缩小该元素。当值为1时将不进行任何处理,当为负数时,将进行像素点反射之后再进行大小的修改。

    语法:

    scale(sx, sy)

    sx:表示缩放向量的横坐标

    sy:表示缩放向量的纵坐标。如果未设置,则默认与sx值相同,进行位似变换

    举例说明:

    HTML

    <p>foo</p>
    <p class="transformed">bar</p>

    CSS

    p { 
      width: 50px;
      height: 50px;
      background-color: teal;
    }
    
    .transformed {
      /* 等同于 scaleX(2) scaleY(0.5) */
      transform: scale(2, 0.5);
      transform-origin: left;
      background-color: blue;
    }

    效果如下:

    点击链接查看

  • 相关阅读:
    SQL执行效率1
    php经典算法(转载)
    linux自用命令
    vim基本命令
    xampp安装
    BUU-rsa
    z3约束器学习笔记
    面试前夕oi挣扎式复习
    bss上的格式化字符串漏洞
    一、汇编
  • 原文地址:https://www.cnblogs.com/guohaojintian/p/6476511.html
Copyright © 2011-2022 走看看