Javascript 更改角度材质输入样式
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32585442/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Change angular material input style
提问by Ellone
I am trying to change the style of a angular material input.
我正在尝试更改角度材质输入的样式。
So far I managed to change the background-colorusing :
到目前为止，我设法改变了background-colorusing ：
md-input-container {
padding-bottom: 5px;
background-color: #222;
}
The placeholder and label color using :
占位符和标签颜色使用：
md-input-container.md-default-theme label,
md-input-container.md-default-theme .md-placeholder {
color: #FDFE67 !important;
}
But I can't manage to change the line color under the text when we focusthe input and the text color when we type in the input.
但是当我们focus输入时我无法改变文本下的线条颜色和我们输入时的文本颜色。
Here is the html input :
这是 html 输入：
<md-content>
<md-input-container>
<label>{{isEnglish ? 'Search...' : 'Recherche...'}}</label>
<input ng-model="searchInput" id="sInput"
ng-change="filterCartoList(searchInput)" my-enter="filterCartoList(searchInput)">
</md-input-container>
</md-content>
Edit:I managed to change the text color when typing this way :
编辑：以这种方式输入时，我设法更改了文本颜色：
md-input-container .md-input {
color: rgba(255,255,255,0.87);
border-color: rgba(254,253,103,0.82);
}
回答by Fez Vrasta
This is the CSS selector used by Angular Material:
这是 Angular Material 使用的 CSS 选择器：
md-input-container:not(.md-input-invalid).md-input-focused .md-input {
border-color: your_color_here;
}
回答by Stav Bodik
<md-input-container style="position: relative; top:19px;">
<label style="border-color: white; color: white;">Email</label>
<input style="border-color: white; color: white;" >
</md-input-container>
