0

我的主题占据了屏幕宽度的 50%，这在较大的屏幕上留下了很好的边距。但是在较小的屏幕上，这会占用宝贵的屏幕空间。是否可以让边距“折叠”以保持主题宽度？或者可能给出可接受的宽度范围？基本上我希望在主题缩小之前缩小边距。

<!doctype html>

<html>

  <head>
  </head>

  <body style="margin-left:auto; margin-right:auto; width:50%;">

    <p style="height:100%; background:#878787;">some text</p>

  </body>

</html>
4

1 回答 1

1

您可以考虑使用 CSS@media查询。

为确保边距在内容之前缩小，请为内容使用固定的像素宽度，并且margin: 0 auto.

当像素宽度比屏幕宽时，使该宽度更小：

body {
    width: 500px;
    margin: 0 auto;
}

@media screen and (max-width: 500px) {
    body {
        width: 250px;
    }
}
于 2013-03-07T04:02:20.883 回答