CSS scale()方法,改变元素大小

scale()方法

CSS中元素的transform属性的scale()方法,可以根据指定的元素的高度和宽度,增加或减少元素的大小。比如下方的示例,当鼠标悬停,div的高度和宽度都将缩小为原来的二分之一。


语法

transform:scale(value1, value2)

提示:value1和value2分别指定元素的宽度和高度设置为原来的倍数,如果大于1,则进行增大,如果小于1,则进行缩放。比如上方示例中就将宽度和高度的value1和value2设置为原来的0.5。


scale()实例代码,及在线编辑器

<div id='d2'></div>
<style>
#d2{width:100px;height:100px;background-color:pink;margin-left:100px;margin-top:100px;}
#d2:hover{transform:scale(2,2);}
</style>

全栈前端 / CSS教程 :



























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