如何覆盖CSS样式的Bootstrap为“.navlink”？

qltillow 于 2022-12-16 发布在 Bootstrap

关注(0)|答案(4)|浏览(243)

我无法将html文件中的.navlink颜色更改为白色。请帮助我将.navlink颜色更改为白色。

<section id="navbar-section">
   <nav class="navbar navbar-dark navbar-expand-md bg-primary " >
       <a href="#" class="navbar-brand">tent workshop</a>
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
           <span class="navbar-toggler-icon"></span>
       </button>
       <div class="collapse navbar-collapse" id="navbarSupportedContent">
           <ul class="navbar-nav">
               <li class="nav-item active" >
                   <a href="#" class="nav-link" aria-current="page">Home</a>
               </li>
               <li class="nav-item active" >
                   <a href="#" class="nav-link" aria-current="page">Contact</a>
               </li>
               <li class="nav-item active" >
                   <a href="#" class="nav-link" aria-current="page">Products</a>
               </li>
           </ul>
       </div>

   </nav>
</section>

twitter-bootstrap

来源：https://stackoverflow.com/questions/71047897/how-to-override-css-styles-of-bootstrap-for-navlink

4条答案

按热度按时间

smdnsysy1#

您应该始终使用Bootstrap使用的选择器，以便能够覆盖bootstrap定义的颜色。另外，您的CSS必须包含在Bootstrap之后。

.navbar-nav .nav-link {
  color: #ffffff;
}

.navbar-nav .nav-link:focus, 
.navbar-nav .nav-link:hover {
  color: #ffffff;
}

或者使用“！important”覆盖 Bootstrap 中的CSS

.nav-link {
  color: #ffffff!important;
}

.nav-link:focus, 
.nav-link:hover {
  color: #ffffff!important;
}

赞(0）回复(0）举报 2022-12-16

xhv8bpkk2#

只需在元素的类名中定义它：

<a href="#" class="nav-link link-light" aria-current="page">Home</a>

用法：

链路指示灯
暗链接
主链路
链路成功

赞(0）回复(0）举报 2022-12-16

yzuktlbb3#

您能试试这个吗？

<a href="#" class="nav-link" style="color:white;" aria-current="page">Home</a>

style=“颜色：白色;“它通常起作用

赞(0）回复(0）举报 2022-12-16

olmpazwi4#

<nav class="navbar navbar-light navbar-expand-md bg-light " >

试试这个。它会让你的导航栏背景色变成白色

赞(0）回复(0）举报 2022-12-16

我来回答

如何覆盖CSS样式的Bootstrap为“.navlink”？

4条答案

相关问题

热门标签

最新问答