Question

在这段代码中，我为导航栏创建了一个div。 div显示正确，但是当填充为0时，顶部填充和左填充有空间。任何人都知道为什么？谢谢。

<html>

<head>
<title>Blitz</title>


<style>
.Navigationbar{
background-color:#2DDEDE;
height:auto;
border:none;
}

.Navigationbar li{
display:inline;
}

</style>
</head>

<body>


<div class="Navigationbar">
<ul>

<li><a href="#">Home</a></li>
<li><a href="#">Forums</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Featured</a></li>
<li><a href="#">Sign up</a></li>
<li><a href="#">Login</a></li>
</ul>
<h1><center>Blitz</center></h1>


</div>

</body>

</html>

Answer 1

您的身体标签有8像素边距。可以像这样删除：

<html>

<head>
<title>Blitz</title>


<style>
.Navigationbar{
background-color:#2DDEDE;
height:auto;
border:none;
}

.Navigationbar li{
display:inline;
}
.nomargin
{
    margin: 0px;
}
</style>
</head>

<body class="nomargin">


<div class="Navigationbar">
<ul>

<li><a href="#">Home</a></li>
<li><a href="#">Forums</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Featured</a></li>
<li><a href="#">Sign up</a></li>
<li><a href="#">Login</a></li>
</ul>
<h1><center>Blitz</center></h1>


</div>

</body>

</html>

Answer 2

您还需要将身体边距设置为0：

body {
  margin: 0;
}

Answer 3

body {
    margin: 0;
}

ul {
    padding: 0px;
}

Answer 4

添加到您的代码

body{
    margin: 0;
}

为什么div不是页面的顶部？

4 个答案: