如何更改 Angular 材质日期选择器弹出日历的样式

Question

我只被允许使用 Angular 材料（没有 Bootstrap 或任何其他库）。

如何更改此弹出式日历的样式？喜欢字体，背景颜色，或者不是圆形，我希望它是方形按钮，如样式或用于来回导航的箭头。

Answer 1

只需右键单击日期选择器并检查使用的 CSS 类。复制 CSS 类名并使用相同的类名编写新的 CSS 样式。这样就可以覆盖CSS样式了。

假设，圆形/圆形默认 CSS 类是“.mat-calendar-body-cell-content”。现在复制类名并创建一个新类，如下所示。

.mat-calendar-body-cell-content{
     background: #FFCC00 !important;
}

这种新样式将覆盖现有的 CSS 样式。