改变<md-toolbar>的颜色?

时间:2015-11-06 06:31:32

标签: html css angularjs angular-material

这就是我的代码在CodePen上的样子:

我想要&#34; Sidenav Left&#34;的背景是&#34; Menu Items&#34;的那个,由类表示为

.nav-theme {
  background-color: #34495E
}

我尝试将其覆盖为

.nav-theme, .md-theme-indigo {
  background-color: #34495E
}

但这不起作用,我需要做什么?

2 个答案:

答案 0 :(得分:4)

在CSS选择中更具体地覆盖。由于以下选择器更具体,因此它们的优先级将高于之前未被覆盖的默认背景颜色。这样就可以避免使用!important

.md-sidenav-left .md-theme-indigo, .md-sidenav-left .nav-theme {
    background-color: #34495e;
}

CodePen Demo

答案 1 :(得分:2)

您可以使用 md-colors 指令将其设置为调色板中的颜色。这样,如果您选择不同的主题,它会自动更改。

<md-toolbar md-colors="::{background: '{{theme}}-primary-700'}"