【bootstrap,导航栏组的颜色怎么更改? 】

bootstrap,导航栏组的颜色怎么更改?
我也踩过这个坑( 1 )
已统计您的踩坑,无需重复点击
回答(0)
详细描述
截图
代码
  <!--nav-->
        <div class="container-fluid  nav-container">
            <div class="row">
                <div class="col-sm-8 offset-sm-2">
                    <nav class="navbar navbar-expand-sm navbar-dark" style="padding:0">
                        <a class="navbar-brand" href="#">
                         <img style="width:20rem" src="home-logo-hs.png" />
                        </a>
                        <button class="navbar-toggler" type="button" data-toggle="collapse"
                            data-target="#collapsiblejnshu">
                            <span class="navbar-toggler-icon"></span>
                        </button>
                        <div class="collapse navbar-collapse" id="collapsiblejnshu">
                            <ul class="navbar-nav justify-content-end" style="width:100%">
                                <!--链接组(导航组)-->
                                <li class="nav-item">

                                    <a class="nav-link nav-a" href="task8-1.html">首页 </a>
                                    <div class="nav-li"></div>

                                    <!--链接-->
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link nav-a" href="../task8.1.3/task8-3.html">职业</a>
                                    <div class="nav-li"></div>
                                    <!--链接-->
                                </li>
                                <li class="nav-item ">
                                    <a class="nav-link nav-a" href="../task8.1.3/task8-3.html">推荐</a>
                                    <div class="nav-li"></div>
                                    <!--链接-->
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link nav-a" href="../task8.1.2/task8-2.html">关于</a>
                                    <div class="nav-li"></div>
                                    <!--链接-->
                                </li>
                            </ul>
                        </div>
                    </nav>
                </div>
            </div>
        </div>
/*nav样式*/
.nav-container {
    background-color: rgb(41, 176, 120);
    color: white;
}

.nav-a {
    font-size: 1.7rem;
    padding: 20px 0 20px 10px;

}

.nav-item:hover .nav-li {
    visibility: visible;
}

.nav-li {
    visibility: hidden;
    border-bottom: 1px solid white;

}
编辑于2024-11-22