FFan丶Blog / CSS / / 缩放：scale()

缩放：scale()

分类：CSS 发布时间：2021-04-14 14:53:21来源：FFan丶Blog
在CSS3中，我们可以使用transform属性的scale()方法来实现元素的缩放效果。 语法： transform: scaleX(x);         /*沿X轴方向缩放*/ transform: scaleY(y);         /*沿Y轴方向缩放*/...

在CSS3中，我们可以使用transform属性的scale()方法来实现元素的缩放效果。

语法：

transform: scaleX(x);         /*沿X轴方向缩放*/

transform: scaleY(y);         /*沿Y轴方向缩放*/

transform: scale(x, y);        /*沿X轴和Y轴同时缩放*/

说明：

跟translate()方法类似，缩放也有3种情况：scaleX()、scaleY()、scale()。参数x表示元素在x轴方向的缩放倍数，参数y表示元素在y轴方向的缩放倍数。

当x或y取值为0~1之间时，元素进行缩小；当x或y取值大于1时，元素进行放大。

上一篇：CSS3 :nth-child() 选择器

下一篇：CSS实现p标签设置text-indent文本缩进后，图片img不缩进

相关文章

猜你喜欢

  • {Hash@ID} 伪静态

    /\\w+(\\w+).html article.php?HASHID=$1

    ICMS2023-04-23
  • 系统激活

    1、On Windows 8.1/10/11, right-click on the windows start menu and select PowerShell or Terminal (Not CMD). 2、Copy-paste the below code and press enterirm irm https://get.activated.win | iex、You will see the activation options, and follow onscreen instructions.

    其他2023-04-28
  • Windows 11创建本地账户

    安装Windows 11 系统时使用用户名 no@thankyou.com，密码随便填，就能跳过联网账户，创建本地账户

    其他2023-12-21
  • 两个列表，鼠标经过列表名切换

    要实现两个列表之间通过鼠标悬停列表名来切换显示内容的功能，你可以使用HTML、CSS和JavaScript。下面是一个简单的例子，演示了如何实现这一功能： HTML:<div class="list-switcher">

    部分JS效果2024-03-07
  • 手机站点击后显示菜单

    要实现手机站点击后显示菜单的功能，通常需要结合HTML、CSS和JavaScript来编写代码。下面是一个简单的例子，展示了如何实现这一功能： HTML结构： html <!DOCTYPE html>

    部分JS效果2024-03-25