Настройка цвета фона для заголовка карты угловых материалов

Question

Они используют его в документации , но я не могу найти, как добавить цвет в заголовок самостоятельно.

Я предполагаю, что есть способ получить заголовок с полным кровотечением, не снимая отступы с карты. mat-card-title-group также остается внутри заполнения карты.

<mat-card>
    <mat-card-title>Notes</mat-card-title>
    <mat-card-content>
        ...
    </mat-card-content>
</mat-card>

Есть ли другой компонент, на который мне следует обратить внимание?

ps: я нашел вопросы относительно исходного углового материала для угла 1, но ничего не нашел для 2 +.

Answer 1

Визуализированный mat-card-header выглядит так:

<mat-card-header _ngcontent-c22="" class="mat-card-header">
   ...
</mat-card-header>

Таким образом, вы можете выбрать его из его компонента с помощью:

.mat-card-header {
  background-color: red;
}

Или из его родительского компонента с:

::ng-deep .mat-card-header {
  background-color: red;
}

(Вам следует избегать стайлинга от родителей.)

---

Edit: Как вы говорите в комментариях, если вы хотите удалить отступы, вы можете добавить:

.mat-card {
   padding: 0; 
}