Html 更改twitter引导导航栏项目的颜色_Html_Css_Bootstrap 4_Navbar

Html 更改twitter引导导航栏项目的颜色

html css bootstrap-4

Html 更改twitter引导导航栏项目的颜色,html,css,bootstrap-4,navbar,Html,Css,Bootstrap 4,Navbar,我对网络没有太多经验。首先，我在这里引用了这篇文章，但在我的情况下，它无法发挥作用我正在尝试将每个导航栏菜单项的颜色更改为红色，但无法使其工作。其次，如果我想为a href项目使用单独的样式，其中id=“active”。如何在css中引用该特定项。请帮忙 .navbar-nav > li > a{ color:red; } .navbar-nav > li:hover a{ background: blue;

我对网络没有太多经验。首先，我在这里引用了这篇文章，但在我的情况下，它无法发挥作用

我正在尝试将每个导航栏菜单项的颜色更改为红色，但无法使其工作。其次，如果我想为a href项目使用单独的样式，其中id=“active”。如何在css中引用该特定项。请帮忙

.navbar-nav > li > a{
        color:red;
    }
    
        .navbar-nav > li:hover a{
        background: blue;
        border-radius: 7px 7px 0px 0px;
        color: #2056ac;
}

这是我的身体

<body>
<div class="container mt-3">
<nav class="navbar navbar-expand-md bg-dark navbar-dark">

<a href="" class="navbar-brand">KGS</a>

<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#target">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse" id="target">
<ul class="navbar-nav">
<li class="nav-item">
<a href="#" id="active" class="nav-link">Home</a>
</li>

<li class="nav-item">
<a href="#" class="nav-link">Our Clients</a>
</li>
   
</ul>
</div>
</nav>
</div>
    
</body>

Bootstrap附带了一些预定义的样式，因此为了覆盖它们，一个简单的方法是使用关键字

！重要信息

在css中。如果您省略了这个关键字，那么在您的案例中，由于Bootstrap的默认样式，您不太可能看到颜色变化，因此我建议您添加它

CSS

.nav-link, .navbar-brand{
    color: red!important;
}

#active{
    color: blue!important;
}

请参阅codeply:

您想更改文本的颜色还是导航栏项目的背景颜色？我想更改文本的颜色。@nikhil您需要更多帮助吗？不，非常感谢。就这些了。如果我需要帮助，我会发布一个新问题并给你贴标签。你能帮我吗，