翻译

HTML

<div class="translate"></div>

CSS

.translate {
    width: 100px;
    height: 100px;
    background: teal;
    transform: translate(200px, 50%);
}

此示例将在 X 轴上移动 div 为 200px，在 Y 轴上移动 100px * 50% = 50px。

你还可以在单​​个轴上指定翻译。

在 X 轴上：

.translate {
    transform: translateX(200px);
}

在 Y 轴上：

.translate {
    transform: translateY(50%);
}