CSS 转换

示例

的HTML

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

的CSS

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

本示例将div在X轴上移动200px,在Y轴上移动200px 100px * 50% = 50px。

您还可以在单轴上指定平移。

在X轴上:

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

在Y轴上:

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