如何使用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;
}