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

Question

以下是我的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 -->

但是看法仍然相同。不更改颜色和字体。

Answer 1

如果要同时设置div.navbar-collapse和ul.navbar-nav li的样式，请在两者之间添加一个逗号。

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

如果您要给孩子ul样式，请执行此操作。

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

Answer 2

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

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

Answer 3

您在a标记内有li标记，因此您需要将样式直接应用于a标记。

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