Question

我想“集中”我的网页的文字和内容。现在我不想将文本对齐到中心，我仍然想要左对齐，但我想要左右边缘有明显的边距，这样所有东西看起来都相对中心。你能告诉我HTML / CSS来实现这个目标吗？感谢。

Answer 1

<html>
<head>
<style type="text/css">

body {
   text-align: center; /* Center in IE */
}

#content {
   text-align: left; /* reset text-align for IE */
   margin: 0 auto; /* Center in other browsers */
   width: 800px;
}

html {
   overflow: -moz-scrollbars-vertical; /* Force vertical scrollbar in FF */
}

</head>
<body>
<div id="content">

   content here

</div>
</body>
</html>

*更新：我添加了一些CSS，强制在FF中使用垂直滚动条，如下面的一些评论。

Answer 2

在您的页面上创建3列。您的所有文字都在中间列中，并且可以保留为对齐。

在这里查看示例http://matthewjamestaylor.com/blog/perfect-3-column.htm

Answer 3

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

<div id="wrapper">
     <p>This will appear in a centered container</p>
</div>

Answer 4

我相信this可能对您有帮助。

Answer 5

CSS：

#container {
    max-width: 800px;
    margin: 0 auto;
}

在HTML中，将所有内容包装在：

<div id='container'>
...
</div>

（请注意，这个答案与meep的不同之处在于我使用max-width来提供低于800像素的流畅布局，而他正在使用width来提供固定的布局。）

Answer 6

尝试

#div {
  margin:0 auto
};

Answer 7

有一个容器div，您可以在其中放置所有内容：

<html>
<head>
    <title>a sample</title>
</head>
<body>
    <div id="container">
         <h1>this is it</h1>
         <p>all content goes here</p>
    </div>
</body>

然后添加一些css，指定容器div的宽度和边距：

#container {
    width: 750px;
    margin: 0 auto;
}

网页的中心内容

7 个答案: