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

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

}