0

调整浏览器窗口大小时，浏览器只会减少元素后的空间。我想像在 Facebook 中一样减少左侧和右侧的空间。

这是我的代码

CSS：

body{
     margin-left:10%;
     margin-right:10%;
}

HTML：

<body>
Some content
.
.
.
.
</body>

首先，我想到了给min-width身体。但是屏幕尺寸较小的计算机将是一个问题。也min-width不会是好的解决方案。

4

3 回答 3

3

80%只需给你的宽度body和给定margin-left和margin-right给auto中心对齐

   body{
      margin:0 auto;
      width:80%;
    }

建议：

为 body 提供样式不是一个好习惯，请为页面中的顶级父 div 提供样式

像这样，

<body>
<div class="container">
       all page elements.....
</div>
</body>

CSS：

container{
          margin:0 auto;
          width:80%;
        }
于 2012-11-23T09:35:03.310 回答
1

你考虑过媒体查询吗？ https://developer.mozilla.org/en-US/docs/CSS/Media_queries

这是一个演示： http: //playground.johanbrook.com/css/mediaquerydebug.html

和另一篇好文章：http ://css-tricks.com/css-media-queries/

于 2012-11-23T09:29:47.413 回答
1

有什么问题

width: 50em;
max-width: 95%;
margin: 0 auto;

正如网络上多次建议的那样，显示一个居中的包装器，它会随着浏览器窗口收缩和扩展，左右间距相等……</p>

于 2012-11-23T09:33:54.967 回答