问全页宽边框，居中内容，最好的方式？
EN

Stack Overflow用户

提问于 2010-02-17 21:37:03

回答 1查看 1K关注 0票数 0

我刚才做的很多设计都要求页面居中，我用的是页边距:0自动，宽度: 955；

每个主要部分都有一个带有底部边框的div，在此布局中，屏幕中央的宽度为955。

但是，我希望实际边框是整个页面的宽度。

干净利落地做这件事的最好方法是什么？我一直在用StackOverflow做页脚的方法，但是如果我在一个页面上有3个边框，那会不会很乱呢？

css

html

回答 1

Stack Overflow用户

回答已采纳

发布于 2010-02-17 23:13:25

如果你想有几个部分被横跨整个宽度的边框分开，你最好的选择是按如下方式组织页面：

<body>
  <div id="container" style="width: 100%;">
    <div style="width:100%;border-top:1px solid black;">
       <div style="width:955px; margin:0 auto;">
           Section 1 Content
       </div>
    </div>
    <div style="width:100%;border-top:1px solid black;">
       <div style="width:955px; margin:0 auto;">
           Section 2 Content
       </div>
    </div>
    <div style="width:100%;border-top:1px solid black;">
       <div style="width:955px; margin:0 auto;">
           Section 3 Content
       </div>
    </div>
  </div>
  <div id="footer" style="border-top: 1px solid black;">
    Footer Content
  </div>
</body>

为了让您的工作更轻松，我强烈建议用类名替换内联样式，并使用外部样式表。这样，您就可以为每个部分指定相同的类名，并且只需编写一次样式。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/2281020

复制

相似问题

问全页宽边框，居中内容，最好的方式？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问全页宽边框，居中内容，最好的方式？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问全页宽边框，居中内容，最好的方式？
EN