首页 > 解决方案 > Bootstrap 4 粘性顶部不起作用

问题描述

我正在为我的网站设计一个粘性顶部导航栏,我遵循了 Bootstrap 在他们的网站上提供的文档,并查看了之前在这里提出的问题,但我无法弄清楚它为什么不起作用。任何帮助都会很棒

        <!DOCTYPE html>

        <html>


<nav class="navbar navbar-expand-sm bg-dark navbar-dark sticky-top">
    <div class="collapse navbar-collapse justify-content-center" id="navbarNav">
        <ul class="navbar-nav">
            <li class="nav-item active">
                <a class="nav-link" href="about.html">ABOUT</a>
            </li>


            <li class="nav-item">
                <a class="nav-link" href="#">CLOTHING</a>
            </li>


            <li class="nav-item">
                <a class="nav-link" href="#">CLOTHING</a>
            </li>


        </ul>
    </div>
</nav>






    </body>
    </html>

CSS

.navbar {
    background-color: #2A2F35 !important;
    padding: 0 !important;
}

/*Navbar Links*/

.navbar-nav a {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-size: 16px;
    font-weight: 100;
    letter-spacing: 1px;
    color: #ffffff !important;
    padding: 25px;
    margin: 0px 25px 0px 25px;
}

.navbar-nav a:hover {
    color: #ff6600 !important;
}

标签: csstwitter-bootstrap

解决方案


<nav class="navbar **fixed-top** navbar-light bg-light">

'fixed-top' 似乎不在导航类中。


推荐阅读