CSS scaleX()方法,增大或缩小元素宽度

scaleX()方法

CSS中2D动画之中,元素的transform属性的scaleX()方法,可以基于原有的元素宽度的基础上,以相对比例地增大或缩小元素的宽度,比如下方的示例便是将元素的宽度缩小为原来的0.5(可以将鼠标放在元素上面,看看缩放的效果):


语法

transform:scaleX(value)

提示:value为数值类型的值。


scaleX()方法实例代码,及在线编辑器

<div style='width:60px;height:60px;background-color:skyblue;margin-left:25%;' id='d2'></div>

<style>
  #d2:hover{transform:scaleX(1.5)}
</style>

全栈前端 / CSS教程 :



























Copyright © 2022-2024 笨鸟工具 x1y1z1.com All Rights Reserved.