HTML 背景颜色没有填满整个页面？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25329260/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML Background color not filling whole page?
提问by Alana Stephens
Hey everyone here's a picture of the problem:
大家好，这是问题的图片：
I want it to fill the the whitespace on the left right and top of the green box.
我希望它填充绿色框左侧和顶部的空白。
HTML:
HTML：
<!DOCTYPE HTML>
<html>
<head>
<LINK href="style.css" rel="stylesheet" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
<title>Test page</title>
</head>
<body>
<div id="container" name="header">
<h1>Blegh</h1>
<style>
#container {font-family: 'Montserrat', sans-serif;}
</style>
</div>
</body>
</html>
CSS:
CSS：
#container{
background-color: #58FA58;
margin-left: auto;
margin-right: auto;
text-align: center;
height: 100px;
width: 100%;
}
采纳答案by j08691
These two rules should do it:
这两条规则应该这样做：
html, body {
margin:0;
padding:0;
}
h1 {
margin:0;
}
回答by Mahdi Salehian
that's because of browsers. default of browsers has margin and padding and you should set padding and margin to zero in all of your projects
那是因为浏览器。浏览器的默认设置有边距和内边距，您应该在所有项目中将边距和边距设置为零
body{
margin: 0px;
padding: 0px;
}
回答by Nino Mirza Mu?i?
you set div heigt to 100 px :)
您将 div heigt 设置为 100 px :)
to make div like boddy wraper you shlud have this CSS
要使 div 像 boddy wraper，你必须拥有这个 CSS
* {
margin: 0;
}
html, body {
height: 100%;
}
#container{
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -20px;
}
.footer, .push {
height: 20px;
}
回答by Jesse
You have to remove the body margins. Add this to your css:
您必须删除正文边距。将此添加到您的CSS：
body {
margin: 0px;
padding: 0px;
}
回答by simmer
Add this to your style.css:
将此添加到您的 style.css 中：
html, body {
margin: 0;
padding: 0;
}
回答by StephenCollins
Applying a margin and padding of 0 will allow all of your elements to reach the borders of the page. But if you want the color to fill the entire page, which seems to be the actual question, apply your background-color to the body tag.
应用 0 的边距和填充将允许您的所有元素到达页面的边框。但是，如果您希望颜色填充整个页面，这似乎是实际问题，请将您的背景颜色应用于正文标签。
body {
margin: 0px;
padding: 0px;
background-color: #58FA58;
}
