聚合物-进纸浮动标签颜色

Question

如何更改聚合物中聚焦浮动标签的颜色？

感谢您的回答。

Answer 1

我能够解决这个问题的唯一方法是：

paper-input-decorator[focused] /deep/ .floating-label,
paper-input-decorator[focused] /deep/ .label-text {
/* floating label color when the input is focused */
color: orange !important;
}

注意有必要输入 paper-input-decorator[focused] /deep/ 两次

Answer 2

如果你不想使用 /deep/ 选择器，你也可以使用 core-style 来做到这一点，它看起来像这样（未经测试）：

<core-style id="paper-input-decorator">
  .floating-label, .label-text {
    color: orange;
  }
</core-style>

Answer 3

您可以设置以下聚合物样式变量：--paper-input-container-focus-color，例如

#myInput{
   --paper-input-container-focus-color: red;
}

Answer 4

For an Information:

更改标签或浮动标签在paper-input中的任何样式, 使用下面的代码。

paper-input {
  --paper-input-container-label: {
    color: red;
    font-size: 14px;
  };
  --paper-input-container-label-floating: {
    color: red;
    font-size: 14px;
  };
}