带有浮动标签占位符颜色的离子输入在离子中没有变化答案

【问题标题】：ion-input with floating label placeholder colour is not changing in ionic带有浮动标签占位符颜色的离子输入在离子中没有变化
【发布时间】：2019-01-03 01:52:47
【问题描述】：

我想更改离子输入的占位符颜色，但我无法更改占位符颜色。我有带有浮动标签的离子输入。这是我的解决方法...

<ion-item>
    <ion-label floating>first Name</ion-label>
    <ion-input type="text"></ion-input>
</ion-item>

我已经尝试过但没有工作......

1) $text-input-placeholder-color

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: pink;
}
::-moz-placeholder { /* Firefox 19+ */
  color: pink;
}
:-ms-input-placeholder { /* IE 10+ */
  color: pink;
}
:-moz-placeholder { /* Firefox 18- */
  color: pink;
}

::placeholder {
  color: blue;
  font-size: 1.5em;
}

但没有任何效果。谁能帮我解决这个问题？

【问题讨论】：

标签： ionic-framework ionic2 ionic3 placeholder

【解决方案1】：

这不是占位符。还是ion-label

要改变浮动离子标签的样式，

将此添加到您的variable.scss

$label-ios-text-color: blue;
$label-md-text-color: blue;
$label-ios-text-color-focused: blue;
$label-md-text-color-focused: blue;

或编辑您的.scss

.label[floating],
.label[stacked],
.input-has-focus .label[floating] {
    color: blue ;
}

【讨论】：

【解决方案2】：

ion-item.item-has-focus > ion-label { color: red ; }

【讨论】：

请为您的答案提供更多详细信息，您的代码是什么或如何回答 OP 问题

【解决方案3】：

只是为这个问题提供了一个更简单的解决方案。当您有多个规则设置属性时，即color: red;，CSS 将应用具有更多“优先级”的规则。没有一个选择器的优先级高于关键字!important。

ion-label {
   color: your-awesome-color-here !important;
}

【讨论】：