CSS顶级菜单栏

Question

我正在尝试创建一个类似于stackoverflow的顶级菜单栏（但具有固定位置）。

JSFIDDLE Demo

菜单栏的左侧和顶部有一个空格。我该如何删除该空间？

提前谢谢你......

Answer 1

重置margin & padding：http://jsfiddle.net/yw4e69qo/1/

简单地

html * {
    margin: 0;
    padding: 0;
}

但更全面 - 深入探讨这个话题：http://meyerweb.com/eric/tools/css/reset/

非常有用：）

Answer 2

body{
 margin:0;
 padding:0;
}

#nav{
margin:0
}

这将解决您的问题，而无需更改菜单项的菜单位置

Answer 3

#nav {
    padding:0;
    margin:0;

}

Answer 4

由于ul属性，

padding元素在左侧始终具有默认list-style。如果检查控制台中的元素，您可以准确地看到创建边缘的内容。所以简单地说下面就可以解决问题了：

#nav {
    margin: 0;
    padding: 0;
}

此外，您应该考虑使用reset.css文件，这样您就不必在页面的每个列表上自行完成这样的重置。在您的css中使用全局选择器，如下所示：

ul {
    margin: 0;
    padding: 0;
}

重置所有元素被认为是不好的做法，因为它会减慢代码的执行速度，因为它总是要检查选择器是否是全局选择器的一部分。希望这个答案有所帮助。