如何删除导航栏上方的空白区域？

Question

我希望导航栏没有顶部边框，但即使我将“margin”设置为0px，也会有一点空间。

我该如何删除该空间？

码：

 #navigationBar { margin: 0px; padding: 0px; overflow: hidden; background-color: #333; } li { display: inline; float: left; display: block; color: white; text-align: center; padding: 14px 16px; margin: 0px; text-decoration: none; } .active { background-color: #999999; } li a { display: block; color: white; text-align: center; padding: 14px 16px; margin: 0px; text-decoration: none; } 

 <nav> <ul id="navigationBar"> <li class="active">Site1</li> <li>Site2</li> <li>Site3</li> <li>Site4</li> <li>Site5</li> </ul> </nav> 

Answer 1

您尚未删除body和html的默认边距。 添加这个：

html,body{margin:0}

 body,html{margin:0} #navigationBar { margin: 0px; padding: 0px; overflow: hidden; background-color: #333; } li { display: inline; float: left; display: block; color: white; text-align: center; padding: 14px 16px; margin: 0px; text-decoration: none; } .active { background-color: #999999; } li a { display: block; color: white; text-align: center; padding: 14px 16px; margin: 0px; text-decoration: none; } 

 <nav> <ul id="navigationBar"> <li class="active">Site1</li> <li>Site2</li> <li>Site3</li> <li>Site4</li> <li>Site5</li> </ul> </nav> 

Answer 2

使用eric meyers reset css重置所有预设的边距等，然后删除默认边距。