How to change color and font size of mat-select placeholder?
Asked on October 25, 2018
Hello,
I am trying to change color and font size of placeholder of mat-select. I tried as follows:
.matselect-placeholder::mat-select-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: white;
opacity: 1;
}
But it is not working.
Can any one provide solution for this?
Thanks & Regards
Shilpa Kulkarni
Replied on October 26, 2018
We can use <mat-placeholder> element.
<mat-form-field>
<mat-placeholder class="myclass">Select data</mat-placeholder>
<mat-select>
<mat-option value="A">A</mat-option>
<mat-option value="B">B</mat-option>
<mat-option value="C">C</mat-option>
</mat-select>
</mat-form-field>
In styles.css
.myclass {
color: red;
font-size: 20px;
}
Note: <mat-placeholder> has been deprecated in higher version.
