Question

我附上了网站图片绘图的Dropbox链接.. 当前站点从左侧开始，而不是以屏幕为中心..

https://www.dropbox.com/s/7x1uah0j13nljgq/cxc.jpg

这是我的代码： CSS：

body {
margin: 0 auto;
font-family: "Source Sans Pro",sans-serif;
background-color: #f3f3f3;
max-width: 1440px;
overflow-x: hidden;
}

.wrapper {
width: 1000px;
overflow: hidden;
height: 100%;
margin: 0 auto;
}

Answer 1

不要为身体设置宽度。相反，添加另一个包装div并将div的宽度设置为100％，最大宽度值为1440px，如下所示。如果你最终做了其他可能导致页面在某些分辨率下超出正文边界的东西，你可以向body添加一个溢出选项，但这里没有必要，因为粉色容器不会比它的父级大小更宽（）无论如何。

<html>
<head><title>Test</title>
<style>

body {
    padding:0px;
    margin: 0px;
    overflow: hidden;
    }

div.outerWrapper {
    width: 100%;
    margin: 0 auto;
    max-width: 1440px;
    font-family: "Source Sans Pro",sans-serif;
    background-color: #f3f3f3;
    overflow: hidden;
}

div.innerWrapper {
    width: 1000px;
    height: 100%;
    margin: 0 auto;
}
</style>
</head>

<body>
<div class="outerWrapper" style="height: 400px;">
<div class="innerWrapper" style="height: 900%; background-color: red;"></div>
</div>

</body>
</html>

使屏幕分辨率更大，使身体居中

1 个答案: