HTML / CSS-为什么我的页面周围有一个小的空白区域？
[英]HTML/CSS - Why does my page have a small empty area around it?
问题描述
Here I have a very simple webpage. 
这里有一个非常简单的网页。 One div, basically. 基本上是一格。 But this div has an area of nothing around it despite my width being set to 100%. 但是，尽管我的宽度设置为100％，该div周围却没有任何面积。 Here's a picture demonstrating. 这是一张图片。
Below is my code. 下面是我的代码。
<html>
</head>
<link href='mainStyle.css' rel='stylesheet'/>
<script src='jquery.js'></script>
</head>
<body>
<div id='navTop'></div>
</body>
</html>
And my mainStyle.css: 和我的mainStyle.css：
#navTop{
width:100%;
height:10px;
background-color: blue;
position: absolute;
margin: none;
padding: none;
}
This is probably just a dumb CSS mistake. 这可能只是一个愚蠢的CSS错误。 Any help is appreciated! 任何帮助表示赞赏！
4 个解决方案
解决方案1
3 已采纳 2013-03-13 00:57:10
Add: 加：
body {
margin: 0;
}
Browsers give the <body> 8px of margin by default 浏览器默认给<body> 8px的边距
解决方案2
3 2013-03-13 00:57:22
Browsers have default margin/padding on various elements, including html and body . 浏览器对各种元素（包括html和body具有默认的边距/填充。 You'll need to set them to zero as well if you want your div to go right to the edges. 如果希望div移至边缘，则还需要将它们设置为零。
解决方案3
0 2013-03-13 00:57:44
It's likely because you're <body> needs to have it's margins and padding set to 0. 可能是因为您<body>需要将其边距和填充设置为0。
CSS: CSS：
body { margin: 0px; padding: 0px; }
解决方案4
0 2013-03-13 00:57:49
Your browser has default styling (font-size, font-familly, line-height, etc. including margin and padding around the document). 您的浏览器具有默认样式（字体大小，字体系列，行高等，包括文档周围的边距和填充）。
To avoid extra space around the document, you may add in your CSS : 为了避免文档周围多余的空间，您可以添加CSS：
body,div,p { margin:0;padding:0; }
so these elements won't keep default values. 因此这些元素将不会保留默认值。
Another, fancy method, is to use a CSS reset script to ensure that almost all default stylings are overwritten to be 0/null so there is only your own rules that count. 另一个不错的方法是使用CSS重置脚本来确保几乎所有默认样式都被覆盖为0 / null，因此只有您自己的规则才有用。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.