导航栏一直停留在顶部,直到我滚动出英雄形象然后消失。我希望导航栏出现在整个页面中。有任何想法吗?
<nav class="navbar sticky-top navbar-expand-lg navbar-dark bg-dark">
<div class="collapse navbar-collapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#home">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#about">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#projects">Projects</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact Me</a>
</li>
</ul>
</div>
</nav>
<!--Navbar end-->
<!-- Homescreen hero -->
<div class="hero-image" id="home">
<div class="hero-text">
<h1 class="name">Text</h1>
<h1>Text</h1>
</div>
</div>
最佳答案
您可以尝试使用fixed-top
而不是sticky-top
。
我不知道您使用的是哪种浏览器,但文档指出 另请注意 .sticky-top 使用 position: sticky,并非所有浏览器都完全支持它。
( https://getbootstrap.com/docs/4.2/components/navbar/#placement )
关于html - Bootstrap 粘性顶部导航栏在滚动时消失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54135081/