2017-02-10 71 views
1

角材2颜色输入角材2颜色输入

<md-input-container > 
    <input type="password" md-input placeholder="password"> 

</md-input-container> 

我想要的颜色上点击来改变,我该怎么办呢?

回答

2

请记住,你不想疯狂的材质颜色,他们限制和分配给各种用户界面元素和状态的原因。

虽这么说......

如果你是问你如何改变颜色时,该项目具有焦点,你可以使用颜色=“”属性并将其设置为'主“默认”,“口音'或'警告',虽然这会违反一些重要的原则,因为当您这样做时,您可能会向用户发出不正确的状态信号。

<md-input-container color='accent'> 
    <input type="password" md-input placeholder="password"> 
</md-input-container> 

这里设置为“口音”

谷歌的公司名称plunker如果你不喜欢默认的颜色那么我建议如果你真的是你可以创建自己的主题

想发疯,你可以在此改变SASS输入混入了输入类

https://github.com/angular/material2/blob/0666207527299758293a9587a5b79212167a9a70/src/lib/input/_input-theme.scss

我不建议但如果你想坚持的材料设计指南

如果你正在寻找设置的状态,这是一个不同的问题

0

https://material.angular.io/guide/theming

的style.css

.mat-dark { 
     @include angular-material-theme($dark-app-theme); 
     input { 
     color: white; 
     } 
    } 

<div class="mat-dark"> 
    <md-input-container> 
     <input type="password" md-input placeholder="password"> 
    </md-input-container> 
</div> 
0
.mat-focused .mat-form-field-label { 
    color: #5cb53f !important; 
} 

.mat-form-field-ripple { 
    background-color: #5cb53f !important; 
} 
+3

欢迎的StackOverflow 。只有代码的答案倾向于被标记为“低质量”并被删除。请使用“编辑”链接添加一些评论,并解释您的代码如何解决原始问题。 – Graham