Question

我正在使用Angular Material框架开发纯Material Design应用程序。

但是，我不明白如何设置容器＆＃39;背景颜色（例如具有蓝色背景的登录表单）。我当然可以使用CSS来做，但我想知道是否有内置的指令/主题选项来做到这一点。

Answer 1

我很确定我在文档的某个地方看过这个，但我现在无法找到它。你必须做两件事：

设置.backgroundPalette('indigo')与设置主要主题相同的方式
创建容器

我已经在0.8.1版本的角度材料上检查了它，它可以正常工作。

如果您有任何其他问题，请随时询问。

例如：

app.config(function ($mdThemingProvider) {
  $mdThemingProvider
    .theme('default')
    .primaryPalette('indigo')
    .accentPalette('pink')
    .warnPalette('red')
    .backgroundPalette('blue-grey');
});

并在您的模板中：

<md-content>
    <p>Some text</p>
</md-content>

Answer 2

您可以使用md-colors指令设置调色板中的任何颜色。

https://material.angularjs.org/1.1.4/api/directive/mdColors

格式将是[？主题] - [调色板] - [？色调] - [？不透明度]在哪里？表示可选参数。

但根据我的经验，你必须指定主题，即使它是默认主题：

<md-button md-colors="{color: 'default-red-A100', 'background': 'default-primary-600'}">Button</md-button>

Answer 3

在旁注中，忽略了＃34;没有css＆＃34;问题的一部分，我看到Material Angular创建者使用普通的旧css创建背景颜色，请参阅this codepen（您也可以通过Getting Started部分找到它：＆＃34; Fork a codepen＆＃ 34。）

<强> HTML

<div id="content" ng-view flex> </div>

<强> CSS

.demo #content {
  background-color: rgb(255, 244, 220);
  padding:30px;
  font-weight:600;
  border: 1px solid #aeaeae;
  border-top:none;
}

角度材质：如何设置背景颜色（不含CSS）

3 个答案: