How to change color and font size of mat-select placeholder?

Asked on October 25, 2018

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-placeholder class="myclass">Select data</mat-placeholder>
      <mat-option value="A">A</mat-option>
      <mat-option value="B">B</mat-option>
      <mat-option value="C">C</mat-option>

In styles.css

.myclass {
color: red;
font-size: 20px;

Note: <mat-placeholder> has been deprecated in higher version.

Write Answer

©2024 | Privacy Policy | Contact Us