angular - angular/material2 中的深色主题不是深色

标签 angular angular-material2

我正在使用 angular/material2,我正在尝试获得一个深色主题。 关注 https://material.angular.io/guide/theming 处的文档我定义了我的自定义 theme.scss 如下:

$dark-primary: md-palette($md-pink, 700, 500, 900);
$dark-accent:  md-palette($md-blue-grey, A200, A100, A400);
$dark-warn:    md-palette($md-deep-orange);

$dark-theme: md-dark-theme($dark-primary, $dark-accent, $dark-warn);

@include angular-material-theme($dark-theme);

主色、重音色和警告色按照我的自定义主题中的定义显示,但我没有看到深色主题(即黑色背景和前景色相应更改)。

example provided连同文档,我看到背景是通过 css 类设置的,但这不是我期望的行为; dark-theme 在我看来是一种特定“种类”的主题,具有适当的自动化水平。

我错了吗?谁能帮我澄清这个问题?

最佳答案

来自文档:

Finally, if your app's content is not placed inside of a mat-sidenav-container element, you need to add the mat-app-background class to your wrapper element (for example the body).

因此,如果您不使用 ma​​t-sidenav-container 组件,则需要将 Angular Material 2 背景类添加到您的 HTML 正文中,例如:

<body class="mat-app-background">

关于angular - angular/material2 中的深色主题不是深色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41967601/

相关文章:

angular - 是否可以检索 Angular 4 Material Theme 的背景和前景调色板?

Angular Material 2 个选项卡滚动显示在导航上

angular - mat-datepicker 只显示月份和年份

material-design - Jhipster/md-button 不是已知元素

angular - 无法实例化循环依赖! HTTP_拦截器 ("[ERROR ->]") : in NgModule CoreModule

jquery - 从 Controller Angular4 调用 jQuery 函数

javascript - Angular 2、Node JS 和 Passport 问题

angular - NullInjectorError : No provider for NgZone!(Angular 6 库)

angular - 带 ngx-translate 的 Ionic 3 - 延迟加载在浏览器中有效,但在构建后在 android 中无效

webpack - 如何在 webpack 应用程序中包含 Angular 2 Material 主题。 (JHipster)?