css - Rails 导航栏颜色没有完全改变 Bootstrap

标签 css ruby-on-rails twitter-bootstrap navbar

我是 Rails 的新手,到目前为止我一直在尝试更改导航栏的颜色。 我几乎阅读了有关该主题的所有内容,但还没有看到像我这样的案例。 正如您在图片中看到的,导航栏更改为我想要的颜色,但由于某种原因, Angular 落仍然是黑色,而且我的下拉菜单的背景仍然是黑色。

嗯,我不能上传图片,因为我是新来的。 github 存储库位于 https://github.com/nanurbina/janus.git 我希望有人能帮助我。

这是我在 _navigation.html.erb 上的代码

<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
    <span class="sr-only">Toggle navigation</span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </button>
  <%= link_to 'Janus BPO', root_path, class: 'navbar-brand' %>
</div>
<div class="collapse navbar-collapse">
  <ul class="nav navbar-nav">
    <%= render 'layouts/navigation_links' %>
  </ul>
</div>

和css.scss上的代码

  @import "bootstrap-sprockets";
  @import "bootstrap";
.navbar-brand {
  font-size: inherit;
  background-color:#2d246d;
  border-color:#2d246d;
  color:#2d246d;
  }
 .navbar-collapse
    {
    background-color:#2d246d;
    border-color:#2d246d;
    color:#2d246d;
     }
.navbar-inverse .container {
   background-color:#2d246d;
   border-color:#2d246d;
   color:#2d246d;
   }

谢谢!

最佳答案

在您的 html 中将 navbar-inverse 替换为 myNavbar 并将以下内容添加到您的 CSS:

.myNavbar   {
    background-color: #ccc;
    color:#222;
    border: 1px solid #333;
 }

只需将颜色代码更改为您想要的颜色代码即可。

关于css - Rails 导航栏颜色没有完全改变 Bootstrap,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28823658/

相关文章:

html - 在 html 和 css 中的图像旁边放置一个菜单

javascript - 根据单击的单选按钮获取表格单元格的值

ruby-on-rails - Rails 缓存 : Expiring multiple pages for one action

jquery - Rails 从 javascript 删除链接调用

html - Bootstrap 背景图像网格

html - 如何解决此 HTML 间距问题?

html - 如何在下拉单击时将 <nav> 标签内容向下移动并在 <nav> 标签内列出列表

javascript - 无法使用 Rails 3.0 的 best-in-place gem 编辑记录

javascript - Css 重叠 div 与多个 child

javascript - 使用Flask和JQuery,如何在 "POST"方式中通过 "sexy"方法删除一条记录?