更改材质ui文本字段的边框底色

Question

我想更改材质Ui文本字段的边框底部的颜色，并且在聚焦时也应更改颜色。

文本字段 ______________（此边框颜色）

Answer 1

您需要在CSS after选择器中设置颜色。这是附上的屏幕快照，对您有帮助。

只需执行以下操作：

.yourInputFieldClassName:after {
    transform: scaleX(1);
    border-bottom-color: #f44336;
}

让我知道是否可行。

Answer 2

检查元素并查找设置边框颜色的样式。您可能会发现它可能是 .mdc-text-field__input 类。只需覆盖它即可。

input.mdc-text-field__input {
  border-bottom-color: red;
}
input.mdc-text-field__input:focus {
  border-bottom-color: yellow;
}