2016-04-25 122 views
0

如何在md-input-container標籤包含特定輸入後更改顏色?我不希望它變成灰色,因爲它看起來像是變灰了。例如,我想在輸入字段包含輸入之後更改標籤「描述」的顏色。我曾嘗試通過使用此代碼修改CSS MD-輸入容器標籤,但它不工作:如何在插入文本後更改md-input-container標籤的標籤顏色

md-input-container.md-default-theme label, 
md-input-container.md-default-theme .md-placeholder { 
    color: #FDFE67 !important; 
} 

這裏是我的html:

<div ng-app="MyApp" ng-controller="DemoCtrl" layout="column" ng-cloak="" class="md-inline-form inputdemoBasicUsage"> 
    <md-content layout-padding=""> 
    <div> 
     <form name="userForm"> 
     <md-input-container class="md-block"> 
      <label>Input-autofocus</label> 
      <input ng-model="user.firstName" type="text" autofocus> 
     </md-input-container> 

     <md-input-container class="md-block"> 
      <label>Input-md-autofocus</label> 
      <input ng-model="user.title" type="text" md-autofocus> 
     </md-input-container> 
     </form> 
    </div> 
    </md-content> 
</div> 

這裏是我的角度:

angular 
    .module('MyApp', ['ngMaterial', 'ngMessages']) 
    .controller('DemoCtrl', function($scope) { 

    }); 

這是我在codepen代碼: http://codepen.io/zcook/pen/bpxGWJ

+0

什麼是「描述」標籤? –

+0

[是否可以使用輸入值屬性作爲CSS選擇器?](http://stackoverflow.com/questions/10645552/is-it-possible-to-use-an-input-value- attribute -as-a-css-selector) –

回答

1

如果你想在標籤合作陰沉改變時,它具有輸入可以使用...

.md-inline-form md-input-container.md-input-has-value label{ 
    color: red; 
} 

如果你想在標籤顏色改變後,用戶輸入的輸入的焦點移動遠離你可以使用...

.md-inline-form md-input-container.md-input-has-value:not(.md-input-focused) label{ 
color: red; 
} 
+0

嘿,那裏,感謝您的反饋,但它不起作用:( –

+0

它在codepen示例中工作我分叉[http://codepen.io/bslocm/pen/wGEGwe?編輯= 1100]。 –

相關問題