Применять стиль только к тегу <select>, исключая <option>in HTML

Question

Я хочу применить стиль только к родительскому тегу <select>, исключая его <option> дочерние элементы.

См. Код ниже: Я хочу, чтобы при выборе первого варианта мой стиль 'highlight' должен применяется к <select>. Другие теги <option> должны остаться без изменений.

Я хочу сделать это встроенным, а не используя уровень компонента css. Это связано с некоторыми ограничениями руководств по дизайну / кодированию, поскольку все стили выбираются из предварительно определенной основной таблицы стилей, а добавление новых стилей очень редко.

  <select [ngClass]="{ 'highlight': selectedUser === undefined }" [(ngModel)]="selectedUser">
    <option [ngValue]="undefined">
      Select User
    </option>
    <option *ngFor="let user of users" [value]="user">
      {{ user.name }}
    </option>
  </select>

Answer 1

В случае, если вы используете предопределенную глобальную таблицу стилей, вы должны переопределить стиль для тега опции, наследуемого от этих правил.