我想更改我的导航栏字体和颜色

Posted 2023-02-26

【中文标题】我想更改我的导航栏字体和颜色

【英文标题】：I want to change my navbar font and color

【发布时间】：2018-07-08 13:35:12

【问题描述】：

以下是我的scss文件

div.navbar-collapse ul.navbar-nav li 
  color: #E69D32;
  font-family: "Times New Roman", Times, serif;
  font-size: 20px;

这是我的视图文件

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <li><%= link_to "Home", root_path %></li>
        <li><%= link_to "About Us", root_path %></li>
        <li><%= link_to "Contact Us", root_path %></li>
      </ul>
    </div><!-- /.navbar-collapse -->

但观点还是一样的。不改变颜色和字体。

【问题讨论】：

问题是什么？您已经在 CSS 中定义了颜色和字体。你想改变它，什么时候，为什么？

它不会改变。你可以在我编辑的问题中看到。

【参考方案1】：

尝试向您的 link_to 添加一个类，然后设置该类的样式。

<%= link_to "Home", PATH, class: 'style_class' %>

【参考方案2】：

如果您想同时设置 div.navbar-collapse 和 ul.navbar-nav li 的样式，请在它们之间添加一个逗号，如下所示。

div.navbar-collapse, ul.navbar-nav li

如果您想为子 ul 设置样式，请执行此操作。

div.navbar-collapse > ul.navbar-nav li

【讨论】：

我都试过了，但都没有改变……因为 Ruby 标签？

【参考方案3】：

您的li 标签中有a 标签，因此您需要将您的样式直接应用于a 标签。

div.navbar-collapse ul.navbar-nav li 
  a 
    color: #E69D32;
    font-family: "Times New Roman", Times, serif;
    font-size: 20px;