当我们使用scale
时,会改变元素的大小。缩放比例由数值和轴这两个因素来决定。数值介于0.99
和0.01
之间时,元素将变小,相反,数值大于1.01
时,元素将会变大。缩放比例为1
时,元素大小保持不变,它周围的元素并不会因为它的尺寸发生改变而产生重绘。
你可以沿水平或垂直方向缩放元素,或者两者结合。接下来,我们将使用scaleX
将元素水平放大到150%,缩放系数放在括号里。
.h-card {
transform : scaleX(1.5); }
现在用scaleY
把高度缩小到50%。
.h-card {
transform : scale(1.5, .5); }
很显然,括号里的这些值应该用逗号隔开。
继续在实践中观察scale
,我们将用几种方法来改变另一张名片的大小,虚线框依然表示它的初始尺寸。