translateY() - Y轴平移

语法说明

transform: translateY(y);

• y - Y 轴方向的偏移量
• 正值：向下移动（注意：CSS 的 Y 轴正方向是向下的）
• 负值：向上移动
• 等价于 translate(0, y)

示例 1：向下移动

translateY(100px) 将元素向下移动 100 像素

.box {
  transform: translateY(100px);
  /* 向下移动 100px */
}

示例 2：向上移动

使用负值向上移动

.box {
  transform: translateY(-100px);
  /* 向上移动 100px */
}

常见应用场景