Question

我正在使用ionic设置登录页面。我想更改离子输入内部占位符的颜色。如何使用CSS实现该目标

我尝试了

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

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

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

但是它不起作用

Answer 1

转到您的variables.scss并在末尾添加以下代码：

*::-webkit-input-placeholder {
    color: white;
}
*:-moz-placeholder {
    /* FF 4-18 */
    color: $roadmate-header-icon;
}
*::-moz-placeholder {
    /* FF 19+ */
    color: white;
}
*:-ms-input-placeholder {
    /* IE 10+ */
    color: white;
}

这将影响您应用程序中的所有输入，无论您应用什么类。在您的代码中，您只针对已应用了文本输入类的输入

Answer 2

ion-input
{
        --placeholder-color:#fff;
         --color: #fff;
}

使用上述代码，您可以更改Ionic中输入字段的占位符颜色和文本颜色。更多 https://beta.ionicframework.com/docs/api/input

如何自定义离子输入贴片机

2 个答案: