使用CSS增量填充？

Question

有没有办法使用CSS进行增量填充？例如。当视口位于x和Y维度之间时，填充量相对于视口增加了X个像素？

使用@media仅适用于第一个断点，但我希望填充以递增方式更改。

Answer 1

您可以使用vw或vh单位作为填充 - 这些单位相对于视口。

例如

div {
  padding: 2.5vw;
}

请参阅http://codepen.io/anon/pen/QEdgeX

（您还可以使用calc将像素值与vw结合使用）