scaleX() - X轴缩放

语法说明

transform: scaleX(x);

• x - X 轴方向的缩放比例
• 1：保持原始宽度
• > 1：水平拉伸
• < 1：水平压缩
• -1：水平翻转
• 等价于 scale(x, 1)

示例 1：水平拉伸

scaleX(2) 将元素宽度拉伸到 2 倍

.box {
  transform: scaleX(2);
  /* 宽度变为 2 倍，高度不变 */
}

示例 2：水平压缩

scaleX(0.5) 将元素宽度压缩到一半

.box {
  transform: scaleX(0.5);
  /* 宽度缩小到 50% */
}

示例 3：水平翻转

scaleX(-1) 水平镜像翻转元素

.box {
  transform: scaleX(-1);
  /* 水平翻转 */
}