html - Ionic 2 占位符文本样式

Question

我正在使用 Ionic 2 rc0 开发一个应用程序，整个应用程序中有几个输入字段仍然需要样式。

<ion-item class="su-p3-item">
  <ion-label floating class="su-input">Your name</ion-label>
  <ion-input type="text" class="su-input"></ion-input>
</ion-item>

ionic 2 输入 API http://ionicframework.com/docs/v2/api/components/input/Input/

具体来说，我需要更改占位符文本的样式，以及激活时的底部边框。通过 API 和提供的 SASS 变量覆盖，我无法弄清楚如何覆盖输入字段的边框和占位符文本的继承样式。

除了影响每个输入所在的特定页面的这些更改之外，我想避免使用“!重要”(我不希望更改是“全局”)。

Answer 1

使用 Ionic2 RC4，您必须在 app.scss 文件中添加以下行:

.text-input::-moz-placeholder {
  color: white;
}

.text-input:-ms-input-placeholder {
  color: white;
}

.text-input::-webkit-input-placeholder {
  text-indent: 0;
  color: white;
}