为什么<div>标签左右两边都有空格，宽度设置为100%

Question

<html>
<head>
<style>
#main_div{
width:100%;
height:200px;
background-color:#111111;
}
</style>
</head>
<body>
<div id="main_div"></div>       
</body>
</html>

为什么tag左右两边都有空格，宽度设置为100%？我想用 div 填充所有空间，就像许多网站一样，包括本网站中的 header 栏。我怎样才能做到这一点？ http://i.imgur.com/lo4lwRx.jpg"image"

Answer 1

默认CSS 样式 http://www.w3.org/TR/CSS2/sample.html

默认情况下 body 占用 margin: 8px。将 body { margin: 0 } 添加到您的 css。请参阅以下代码段以供参考。

body{
  margin: 0;
}
#main_div {
  width: 100%;
  height: 200px;
  background-color: #111111;
}

<div id="main_div"></div>

Answer 2

将此添加到您的 css

body{
    margin-top: 0px; 
    margin-bottom: 0px; 
    margin-left: 0px; 
    margin-right: 0px;
    padding: 0;
}

为什么<div>标签左右两边都有空格，宽度设置为100%

why <div> tag have spaces in both left and right sides whose width is set to 100%

html

css

expand