html - 更改 mdl-textfield 的颜色

Question

是否有内置方法来更改 Material Design Lite 的颜色 text field ？特别是，使用文本字段之前的默认文本和下划线。在下面的示例中，“文本...”和下划线默认为灰色。我需要它们是白色的，因为我使用的是深色背景。

<!-- Simple Textfield -->
<form action="#">
  <div class="mdl-textfield mdl-js-textfield">
    <input class="mdl-textfield__input" type="text" id="sample1">
    <label class="mdl-textfield__label" for="sample1">Text...</label>
  </div>
</form>

我不想在选择文本字段后更改文本或下划线的颜色，只想在未使用文本字段时更改文本和下划线。

Answer 1

只需覆盖默认样式表:

.mdl-textfield__input{
    border-bottom: 1px solid #fff;
}

.mdl-textfield__label{
    color: #fff;
}