Thay đổi màu trên mdl-textfield

Question

Có cách nào được xây dựng để thay đổi màu sắc của Material Design Lite text field không? Đặc biệt, văn bản mặc định và gạch dưới trước khi trường văn bản được sử dụng. Trong ví dụ bên dưới, "Văn bản ..." và gạch chân là màu xám theo mặc định. Tôi cần chúng trắng vì tôi đang sử dụng nền tối.

<!-- 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> 

Tôi không muốn thay đổi màu của văn bản hoặc gạch chân sau trường văn bản được chọn, chỉ văn bản và gạch dưới khi trường văn bản không được sử dụng.

Answer 1

Chỉ cần ghi đè stylesheet mặc định:

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

.mdl-textfield__label{ 
    color: #fff; 
} 

Answer 2

Tôi tìm thấy một số mã trong tập tin thư viện css, nó trông như thế này:

.mdl-textfield--floating-label.is-focused .mdl-textfield__label,.mdl-textfield--floating-label.is-dirty .mdl-textfield__label,.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label{color:#3f51b5;font-size:12px;top:4px;visibility:visible} 

sau đó tôi đã cố gắng để ghi đè lên phong cách của tôi trong trang web, chỉ cần thay đổi "màu", nó hoạt động! có thêm thông tin tại các tệp css. B)