scaleX関数
関数 scaleX は、要素を
X軸に沿って拡大縮小します。拡大縮小は、
プロパティ transform-origin
で指定される点を中心に行われます。
関数の値は整数または小数です。
値が 1 より大きい場合、要素は拡大され、
より小さい場合（例：0.5）、要素は
縮小します。 1 を指定すると何も変化しません
（これがデフォルト値です）。
構文
cssセレクタ {
transform: scaleX(数値);
}
例
ブロックにホバーした時に、X軸方向のスケールを
1.5 倍に拡大します：
html<div id="elem">lorem ipsum</div>css#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: scaleX(1.5);
}
Результат:
例
ブロックにホバーした時に、X軸方向のスケールを
2 分の1に縮小します：
html<div id="elem">lorem ipsum</div>css#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: scaleX(0.5);
}
Результат: