0

我有一个关于在响应期间阻止左/右边距的 CSS 问题。我需要这样的东西：

@media screen and (max-width: 1024px) {
  body .wrapper {
    width:100%;
  }
}
@media (min-width: 1024px) and (max-width: 1170px) {
  body .wrapper {
    width:70%;
     margin: 0% 5% 0% 25%;
  }
}
@media (min-width: 1170) and (max-width: 1600px) {
  body .wrapper {
    width:65%;
    margin: 0% 10% 0% 30%;
  }
}

html:

<body>
  <div class="wrapper">text here</wrapper>
</body>

当我从 1024px 更改窗口宽度时，它会以 25% 的左边距跳跃。 有没有办法使从 1024px ，左边距平滑增加（而不是跳跃）百分比，在 1171px 处，它将达到，例如 200px（左边距）在 1600px，300px（例如）与自动边距一样。 例如，

@media screen and (min-width: 1024px) {
      body .wrapper {
        width:1024px;
        margin:0 auto;
      }
    }

如果窗口增加，包装块在中间，左右边距将平滑增加，边距相等。我需要相同但左右边距不同。 这可能吗？我会很感激你的帮助。

4

1 回答 1

0

使用这样的东西来使过渡顺利......

transition: 0.5s ease-in-out 0.5s;
于 2016-10-21T15:49:49.943 回答