繁体   English   中英

在Navbar上更改文本颜色

[英]Change text color on Navbar

我无法将Navbar的一个元素更改为白色(以匹配其他元素)。 我已经尝试使用CSS / HTML在StackOverflow上提出其他问题,但它根本不会改变!

这是我的HTML代码:

谢谢,

已尝试过颜色的CSS覆盖,但没有任何动作。

    <nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #d35400;">
        <a class="navbar-brand" href="">P s y c h l y t X | Scala: Client View</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNav">
            <ul class="navbar-nav">
                <li class="nav-item active">
                    <a class="nav-link" href="">Home <span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="">Return to Scala application</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="/scale">Edit my client's outcomes</a>
                </li>
            </ul>
            <ul class="navbar-nav ml-auto">
                <li class="nav-item">
                    <a class="nav-text" >Welcome, <%= @user['info']['name'] %></a>
                </li>
            </ul>
        </div>
    </nav>

 nav {color: #FFFFFF;} a:-webkit-any-link {color: #FFFFFF;} 
 <nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #d35400;"> <a class="navbar-brand" href="">P sychlyt X | Scala: Client View</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav"> <li class="nav-item active"> <a class="nav-link" href="">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" href="">Return to Scala application</a> </li> <li class="nav-item"> <a class="nav-link" href="/scale">Edit my client's outcomes</a> </li> </ul> <ul class="navbar-nav ml-auto"> <li class="nav-item"> <a class="nav-text" >Welcome, <%= @user['info']['name'] %></a> </li> </ul> </div> </nav> 

应用于nav的这些类中的任何一个都具有background-color属性? 如果是,请尝试在颜色之后添加!important。

如果您曾经生成过脚手架,脚手架将带有默认的css样式,可以篡改您的CSS,所以请检查您的asset / stylesheet / scaffold.css并删除那里的css代码,看看它是否有帮助。

如果您使用的是Bootstrap:
navbar-dark更改为navbar-whitenavbar-light并添加text-dark

<nav class="navbar navbar-expand-lg navbar-light text-dark" style="background-color: #d35400;">

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM