javascript - 基于窗口宽度和高度应用 CSS3 转换

Question

我的 Web 应用程序正在使用一些 css3 转换，我想知道根据窗口的宽度和高度执行这些转换的最佳方法。我的 css 正在按照特定顺序进行多次转换，即 body 做一个， body 上的一个元素在 body 做的转换之后做第二个。但是，我的一个转换是硬编码的，以移动元素 X 像素，我想根据窗口的高度和宽度使其动态化。

有没有一种方法没有 javascript(我需要保留这些转换的顺序)来表达如下内容:

.someClass {
    transform:translate(windowHeight /2, windowHeight);
}

Answer 1

transform: translate 可能不是您最好的选择。我会尝试 position: fixed 并使用窗口百分比值:

position: fixed;
top: 50%;
left: 50%;