更改MaterializeCSS中的“输入字段”颜色

Question

我正在使用MaterializeCSS作为设计模板制作供个人使用的个人网站。

我在想，如果我可以改变的绿色十岁上下的颜色在输入栏上这样

到另一种颜色，如红色。

我有两个输入字段，用户名字段和密码字段，用下面的代码：

<div class="row"> 
    <form class="col s12" action="?p=SignIn" method="post"> 
     <div class="row"> 
     <div class="input-field col s3"> 
      <input id="UserName" type="text" class="validate white-text" name="UserName"> 
      <label for="UserName">Username</label> 
     </div> 
     </div> 
     <div class="row"> 
     <div class="input-field col s3"> 
      <input id="Password" type="password" class="validate white-text" name="Password"> 
      <label for="Password">Password</label> 
     </div> 
     </div> 

和如前所述，我使用MaterializeCSS

Answer 1

是的，它是可能的。

颜色以CSS显示（或者在本例中用SASS编写）。

我看了这个文件了：物化/上海社会科学院/组件/表格/ _Input-fields.scss 在那里，我们有自己的变量：$输入焦点色

你可以改变输入颜色和其他变量文件： materialize/sass/components/_variables.scss

然后将其编译回css。 就是这样。

问候

Answer 2

尝试下面的CSS，

input, input:focus { 
    background-color: black; 
} 

label{ 
    color: red; 
}