全屏宽度div区

Question

创建一个占用屏幕整个宽度的div的最佳方法是什么，无论分辨率如何？我正在尝试添加一个“顶部”栏和底部“页脚”区域，其中div具有黑色背景和样式边框，我用小图像创建并重复。出于某种原因，我的尝试是在div的顶部和侧面导致小空间？

我的标记类似于：

<div id="top">

Top bar stuff

</div>

<div id="pagewrap">

All the page content

</div>

CSS

#top {

width: 100%;
margin: 0;
padding: 0;
background-color:#000

Answer 1

通常这是body标签，有一些填充和/或边距。尝试添加：

body {
  padding: 0;
  margin: 0;
}

如果此方法有效，您可能需要考虑修复此类问题的using a normalization stylesheet以及许多其他相关类型的问题。

Answer 2

只需使用top:0;和left: 0;，您也可以取消padding: 0。不要将top: 0;用于除top之外的其他div，请将left: 0;用于其他div以消除左侧空格。

#top {
   width: 100%;
   margin: 0;
   padding: 0;
   background-color:#000
   top: 0;
   left: 0;
}

Answer 3

确保body {1}}中的padding和margin设置为0。