当没有 margins/padding 时，为什么导航不反对包装器？

Question

我不想 space 导航上方 div。默认添加 space 吗？在设计视图中，这不是 space。但在预览中，有 space。请帮忙。我试过了，但没用。

我的编码是：

<div id="container">
<div class="nav">
<ul>
  <li><a href="#">Home</a></li>
  <li><a href="#">Contact Us</a></li>
</ul>

CSS:
.nav ul li {
float: right;
list-style-type: none;
font-family: Helvetica, sans-serif;
font-size: 11px;
color: #000;
}
.nav ul li a {
color: #000;
text-decoration: none;
display: block;
text-align: center;
height: 36px;
width: 80px;
line-height: 36px;
background-color: #FFF;
}
.nav ul li a:hover {
color: #F00;
}
.nav {
margins: 0px;
}

body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
font-family: Helvetica, sans-serif;

}

#container {
background-color: #CCC;
width: 100%;
overflow: hidden;

}

Answer 1

我不确定您当前的 CSS 是什么样子，但这里有一个基本示例，可以说明我认为您正在尝试做的事情。

https://jsfiddle.net/tfb2L5vd/

.nav {
    background:#eee;
}

body {
    margin:0;
}

ul {
    margin:0;
}

我已经去除了和元素的边距，以消除页面顶部的间距。添加背景颜色以强调。

Answer 2

浏览器特定的默认样式似乎为您的某些元素添加了边距。尝试在这些元素上明确定义零边距。特别是那个元素（为了安全起见 html & body）。

html, body{
    margin:0;
}
.nav ul{
    margin:0;
}

固定示例： http://codepen.io/anon/pen/QbWZoW

当没有 margins/padding 时，为什么导航不反对包装器？

How come navigation isn't against the wrapper when there is no margins/padding?

html

css

dreamweaver