相对于视口的右边缘平移元素

Question

我有一个div，它最初是用这个CSS 从屏幕上翻译出来的

transform: translateX(100%);

现在，我希望这个div从右侧按特定数量的像素转换回视图端口。我一直在使用transform: translateX(-450px)，但它相对于视口的原点进行平移，即(x，y(=(0,0(。相反，我想要的是将div 450px从屏幕右侧带入视口
换句话说，我希望我的翻译来源是(x,y)=(100%,0%)
有什么可以做到的吗？

Answer 1

您可以添加多个并排翻译转换CSS。

.box{
transform: translateX(100%) translateX(-450px);
}