<nav>之间有很大差距页面顶部的栏和 <header>它下面的栏。我以前解决过这个问题，但不记得我是怎么做到的。
<html>
<head>
<title>Welcome</title>
<link href="https://fonts.googleapis.com/css?family=Oswald:400,700" rel="stylesheet">
</head>
<body>
<center>
<nav>
<ul>
<a href="#">About Me</a>
<a href="#">Store</a>
<p class="thaf">Thaf</p>
<a href="#">Contact</a>
<a href="#">Stuff</a>
</ul>
</nav>
<header>
<p class="hello">Hello.</p>
</header>
<section>
<p>Quibusdam quid ullamco voluptate. Laboris quem fabulas quibusdam qui in minim
ubi quorum. Quo tamen hic velit. A multos aliqua de vidisse, ea esse litteris,
in aute hic multos, de magna nisi nulla nescius hic ingeniis quae ut ingeniis
firmissimum, se fugiat quibusdam commodo id nostrud a quae excepteur, cupidatat
quis nostrud iudicem. Aute nescius incurreret. Qui qui fore magna magna, ab aute
aliqua et tempor, se quis senserit eu dolor ne ubi legam senserit.</p>
<p>Te illum proident. Minim voluptate pariatur, non varias appellat, ubi do quid
consequat sed qui expetendis te commodo, nam illum cernantur, cillum proident
ubi offendit, veniam mentitum ubi ullamco aut quid ingeniis ubi magna amet.
Eiusmod labore et litteris comprehenderit e non aut illum appellat. Id sunt nisi
enim senserit e appellat sunt ab eiusmod voluptatibus, a tamen consectetur eu
malis despicationes possumus culpa litteris, ut enim sed magna, do aute aliqua
varias tempor qui nam sed veniam probant, ex quo exercitation. Fugiat deserunt
ea lorem nulla si ubi irure fidelissimae. Mandaremus dolore cillum incurreret
esse hic quae ita admodum ne eram a a elit singulis vidisse si anim
tractavissent ullamco tamen possumus se in ab legam probant, eu laboris
firmissimum, quamquam est deserunt non ex irure aliqua culpa offendit. Ut varias
eruditionem et iis fore deserunt coniunctione.</p>
</section>
</center>
</body>
</html>
p.thaf {
display: inline;
font-family: 'Oswald', sans-serif;
margin: 50px;
}
nav {
background-color: darkgray;
padding: 5px;
margin: 0px;
overflow: hidden;
}
a {
text-align: center;
cursor: pointer;
outline: none;
color: #000000;
border: none;
text-decoration: none;
color: inherit;
padding: 23;
font-family: sans-serif;
margin: 50;
}
a:hover {
background-color: #666;
}
p.hello {
text-align: left;
margin-left: 400px;
font-size: 100px;
font-family: 'Oswald', sans-serif;
color: white;
}
body {
margin: 0;
color: white;
background-color: #666;
}
header {
margin: 0;
padding: 0;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
background-color: green;
height: 500px;
}
如果您需要，我还创建了一个 JSFiddle:https://jsfiddle.net/jy1boL8k/1/
最佳答案
将 margin: 0; 添加到 p.hello - 由于 p 标签的字体较大，默认情况下它自动有一个很大的 margin-top，添加到.header元素中。该设置重置它:
关于html - 如何删除 <nav> 和 <header> 之间的空格，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40053459/