翻譯

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%);
}