如何更改导航栏颜色？

Question

我无法更改以下导航栏的颜色。 我想更改背景颜色，该颜色为灰色，例如，我想使用浅蓝色，因此我尝试在导航栏上添加样式属性

<nav class="navbar navbar-expand-lg navbar-light bg-light" style="">

style="color:#ADD8E6"

但它不起作用

这里是

https://www.w3schools.com/code/tryit.asp?filename=FQ92SC7PE45P

有人可以帮我吗？ 谢谢

Answer 1

这些类（navbar-light bg-light）可能会更改背景颜色，您可以使用！important标志为.navbar类添加规则以使其发生

<style>
.navbar {
background-color: #112233 !important
}
</style>

或者您可以使用预定义的颜色，例如bg-primary bg-info bg-danger bg-warning bg-success

Answer 2

您可以通过两种方式使其工作：1.编写CSS代码2.完成操作后以html标记为白色

1. 编写CSS代码在导航栏中添加一个类，例如mytheme

和白色此CSS代码

.mytheme {
background-color: #add8e6 !important;
}

2. 还是按照你的方式做

<nav class="navbar navbar-expand-lg navbar-light bg-light" style="background-color: #add8e6 !important">

Answer 3

尝试更改nav标签的内联css属性，请尝试此操作。

<nav class="navbar navbar-expand-lg navbar-light bg-light" style="background-color:black; color:white; padding:10px">

Answer 4

如果您想通过内联样式进行操作，只需在样式后添加重要内容即可，它将起作用。

<nav class="navbar navbar-expand-lg navbar-light bg-light" style="background-color:red !important;">