Question

如何在包含特定输入后更改md-input-container标签的颜色？我不希望它是灰色的，因为它看起来像是灰色的。例如，我想在输入字段包含输入后/当之后更改标签“描述”的颜色。我尝试使用此代码修改css中的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

Answer 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;
}

如何在插入文本后更改md-input-container标签的标签颜色

1 个答案: