如何使用Materialise w / Ruby on Rails在輸入中更改預定的下划線顏色

Question

我真的很努力地更改下划線的顏色，但我不能，我不知道該在哪里做，請幫助我！ 🙏🙏

      <div class="row">
        <div class="col-md-6 col-md-offset-3">
          <%= form_for(:session, url: login_path) do |f| %>

          <%= f.label :email %>
          <%= f.email_field :email, class: 'form-control white-text' %>
          <br>
          <%= f.label :password %>
          <%= f.password_field :password, class: 'form-control white-text' %>
          <br>


          <%= f.submit "Log in", class: "btn" ,style:"color:white;background-color: #EEB756;" %>
          <% end %>

        </div>
      </div>

Answer 1

您可以更改類.input-field ，並添加更具體的選擇器，例如：

.input-field input

或以電子郵件形式輸入

.input-field input[type=email]

或重點領域：

.input-field input[type=text]:focus

並設置邊框樣式：

.input-field input[type=text]:focus{
     border-bottom: 1px solid #aaa;
} 

您可以在Materialize文檔中閱讀更多信息： http : //materializecss.com/forms.html

編輯：由@ Toby1Kenobi建議編輯

Answer 2

根據文檔，您可以通過修改包含輸入元素的元素（即具有類input-field的元素）的border-bottom和box-shadow的顏色來更改CSS中的下划線顏色。

所以也許是這樣的：

.input-field input[type=email] {
   border-bottom: 1px solid red;
   box-shadow: 0 1px 0 0 red;
}