CODEWITHSUNDEEP
inputionic2
David
David

Reputation: 571

How can I change placeholder's color in ion-input?

<ion-input placeholder="please input" clearInput></ion-input>

I want to change placeholder's color,and should not affect other pages.

Upvotes: 4

Views: 11995

Answers (2)

Michael
Michael

Reputation: 1905

Though the answer by 99tharun works, current ionic (ionic-angular 3.8.0) offers the standard way of doing it via theme viariables. See ionic documentation for the input field page, SASS variables section. Notice $text-input-placeholder-color variable.

Upvotes: 1

99tharun
99tharun

Reputation: 1216

Give a class name for ion-input:

<ion-input class="text-input" placeholder="please input" clearInput></ion-input>

And add the following lines to your page's .scss file:

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

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

.text-input::-webkit-input-placeholder {
  color: red;
}

Upvotes: 13

Related Questions