我想更改默认 Angular Material Datepicker 的主题。我找不到关于这个问题的任何有用信息(我只找到 AngularJS 或旧的 Angular Material)。我使用的是默认 CSS,但我根据自己的喜好对其进行了修改。
这是日期选择器的样子: https://imgur.com/YmJctem
我想把它改成这种类型: https://imgur.com/oVlwCDK
我想使用 Material 日期选择器,因为我实现了一些代码并且它只适用于 Material 日期选择器。
也许这听起来很有趣,但我想为 Angular Material Datepicker 添加一个 Datepicker Material Design。
感谢您的帮助/建议!
最佳答案
如果你能为我们提供一个 plunker,事情会变得更容易。
为了实现您想要的效果,您需要覆盖默认的 Angular Material CSS 类。快速浏览后,您将看到(使用检查)每个元素都有一个 css 类,如“mat-calendar-header”。 您有两个选择:
使用::ng-deep 伪类。 如果要对此类应用自定义样式,可以通过添加 伪类::ng-deep,在你想要的angular material css类前面 覆盖。这种样式可以添加到 Angular 组件特定的 css 文件中。
Applying the ::ng-deep pseudo-class to any CSS rule completely disables view-encapsulation for that rule. Any style with ::ng-deep applied becomes a global style.
示例:
::ng-deep .mat-calendar-header{background-color: red;}
覆盖全局 styles.css 文件中的 Angular Material css 类
关于angular - 如何更改 Angular Material Datepicker 主题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56525157/