早上好伙计们，这只是我在这里的第二个问题，所以请耐心等待我和我的最低要求:
我刚刚写了这篇冗长的消息，说明如何将 ID 和 class 命令放在 section 而不是 容器中，以及为什么该部分突然覆盖了我的 css 高度样式。然后我想为什么不用 .在 CSS 文件中，瞧，它再次起作用了。
但是，我知道有一个新问题。我有一个固定顶部的 Bootstrap 导航栏，当我单击名为 Intro 的第 2 部分时，页面仅向下滚动几个像素以显示第一行文本。我原本打算让网站显示整个介绍容器。有什么建议吗？
我希望这是有道理的:
<body id="page-top">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container" id="navigation">
<div class="row">
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#page-top">Home</a>
</li>
</ul>
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#intro">Intro</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="signup.php"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
<li><a href="#login"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</div>
</div>
</nav>
<section id="intro" class="intro-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-push-1">
<h1>Welcome to TestZat</h1>
Lorem....
</div>
</div>
</div>
</section>
<section id="login" class="login-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-push-1">
<h1>Finde das Login script hier</h1>
</div>
</div>
</div>
</section>
<section id="contact" class="contact-section">
<div class="container" id="contact-section">
<div class="row">
<div class="col-md-10 col-md-push-1" id="contact">
Section content TBD
</div>
</div>
</div>
</section>
最佳答案
现在它可以正常工作了...只需从容器中删除 id。
<body id="page-top">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div id="navigation">
<div class="row">
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#page-top">Home</a>
</li>
</ul>
<ul class="nav navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#intro">Intro</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="signup.php"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
<li><a href="#login"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</div>
</div>
</div>
</nav>
<section id="intro" class="intro-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-push-1">
<h1>Welcome to TestZat</h1>
Lorem....
</div>
</div>
</div>
</section>
<section id="login" class="login-section">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-push-1">
<h1>Finde das Login script hier</h1>
</div>
</div>
</div>
</section>
<section id="contact" class="contact-section">
<div class="container" id="contact-section">
<div class="row">
<div class="col-md-10 col-md-push-1" id="contact">
Section content TBD
</div>
</div>
</div>
</section>
关于html - 节 id 和类定义覆盖容器高度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37524337/