94689


railsでbootstrapを使っている初学者です。  
デバイスを用意た本の投稿サイトを作成しています。  
ヘッダーのナビゲーションメニューのリンクの色を白に変えたいのですがと記述したりscssでリンクの変更もしましたが色が変わりません。

[code]

    <body>
        <header>
    
        <nav class="navbar navbar-expand-md navbar-dark bg-dark ">
          <!--div class= "container"-->
    
        <span><%= link_to "Bookers", root_path  %></span>
    
        <form class= "form-inline ml-auto">
          <% if user_signed_in? %>
          <li class= "list-unstyled">
             <i class="fas fa-home"></i>
             <%= link_to "Home", root_path  %>
             </li>
          <li class="list-unstyled">
            <i class="fas fa-users"></i>
            <%= link_to "Users", users_path  %>
          </li>
          <li class="list-unstyled">
            <i class="fas fa-book-open"></i>
            <%= link_to "Books", books_path  %>
          </li>
          <li class="list-unstyled">
            <i class="fas fa-sign-out-alt"></i>
            <%= link_to "Log out", destroy_user_session_path, method: :delete %>
          </li>
    
          <% else %>
    
          <li class= "list-unstyled">
            <i class="fas fa-home"></i>
             <%= link_to "Home",root_path %>
          </li>
    
          <li class= "list-unstyled">
             <i class="fas fa-link"></i>
             <%= link_to "About", about_path %>
          </li>
          <li class="list-unstyled">
            <i class="fas fa-user-plus"></i>
            <%= link_to "Sign up", new_user_registration_path %>
          </li>
          <li class= "list-unstyled">
            <i class="fas fa-sign-in-alt"></i>
            <%= link_to "Log in", new_user_session_path %>
          </li>
    <% end %>
       </form>
          </ul>
        </nav>
       </div>
    </header>
         <% flash.each do |key, value| %>
        <%= content_tag(:div, value, class: "#{key}") %>
      <% end %>
    
        <%= yield %>
       
      </body>
    
    </html>
    
[/code]


CC BY-SA 4.0
2023-04-28T06:40:27.777
94673
2023-04-30T02:45:36.677
2023-04-28T10:32:44.563
19110
58086
question
ruby-on-rails bootstrap
bootstrapを使ってナビゲーションメニューのリンクの色を変えたい


SCSSに以下のコードを追加してみてください。

[code]

    .navbar .nav-item a,
    .navbar .navbar-brand 
    {
       color: white !important;
    }
    
    .navbar .nav-item a:hover 
    {
       color: rgba(255, 255, 255, 0.8) !important;
    }
    
[/code]

ナビゲーションメニュー内のリンクとブランドのテキスト色を白に設定、マウスオーバーしたときの色も指定しています。  
!importantを使用して、既存のBootstrapスタイルが強制で上書きされます。


CC BY-SA 4.0
2023-04-30T02:45:36.677
94689
2023-04-30T02:45:36.677
53954
94673
answer