Question

* {
    margin:0;
    padding:0;
}

/** General Style Info **/
body {
    background: #003d4c;
    color: #fff;
    font-family:'lucida grande',verdana,helvetica,arial,sans-serif;
    font-size:90%;
    margin: 0;
}
#container {
    text-align: left;
}

#content {
    background: #ffffff;
    clear: both;
    color: #333;
    padding: 10px 10px 10px 10px;
    margin-left: 1%;
    margin-right: 1%;
    margin-bottom: 5px;
    overflow: auto;
    width: 970px;
}

内容部门在容器部门内部。

该网站内置CRT显示器，但当我在液晶显示器上以高分辨率浏览本网站时，我发现该网站右侧有更多空间。

内容或网站未设置在窗口中间。

如何在窗口中间设置它，使左侧和右侧同样远离窗口。

Answer 1

这是我一直这样做的方式：

body
{
    text-align: centre;
    //...
}

#container
{
    margin: 0 auto;
    text-align: left; // resets alignment for rest of site
    width: 970px; // or whatever it needs to be
    //...
}

它适用于大多数分辨率（在1024x768,1360x768,1920x1080上测试，从未听说过使用不同分辨率的人的问题）。

Answer 2

我发现执行此操作的最佳方法是将其包装在另一个边距设置为auto且具有特定宽度的div中。

<强> HTML：

<div id="wrapper">
  <div id="content">
  ...
  </div>
</div>

<强> CSS：

#wrapper {
  margin: 0 auto;
  width: 970px;
}

#content {
  padding: 10px,10px,10px,10px;
  margin-left: 1%;
  margin-right: 1%;
}

Answer 3

#content {
text-align:center;
padding: 10px,10px,10px,10px;
margin-left: 1%;
margin-right: 1%;

}

Answer 4

当你对齐一个元素时，你需要给它一个宽度百分比（液体设计）或固定。

html, body {margin: 0px; padding: 0px;}

#content {margin: 0 auto; padding: 10px;}

使用您的修订版，您只需设置

即可

 margin-left: auto;
 margin-right: auto;

并且会将该元素置于其父元素的中间位置（假设没有其他代码显示）父元素设置为100％

如何在窗口的中间/中心设置网站的位置？

4 个答案: