离子 - 如何更改整个标题背景颜色？答案

【问题标题】：Ionic - how do I change the entire header background-color?离子 - 如何更改整个标题背景颜色？
【发布时间】：2018-01-13 22:48:17
【问题描述】：

我无法更改整个标题颜色。我设法更改了白色标题的颜色，但没有更改显示时间的黑色标题。我知道这不是 Ionic 的一部分，并且是 Android 的一部分，但我见过很多改变颜色的应用程序。

任何帮助都会很棒。

【问题讨论】：

标签： css angular cordova ionic-framework ionic3

【解决方案1】：

使用 Ionic Native 状态栏： npm install @ionic-native/core --save ionic cordova plugin add cordova-plugin-statusbar npm install --save @ionic-native/status-bar 将插件添加到您的应用模块

` ...

import { StatusBar} from '@ionic-native/status-bar';

...

@NgModule({
  ...

  providers: [
    ...
    StatusBar
    ...
  ]
  ...
})
export class AppModule { }

然后在你的rootPage中使用它：

import { StatusBar } from '@ionic-native/status-bar';

constructor(private statusBar: StatusBar) { }

...

// let status bar overlay webview
this.statusBar.overlaysWebView(true);

// set status bar to white
this.statusBar.backgroundColorByHexString('#ffffff');

欲了解更多信息：https://ionicframework.com/docs/native/status-bar/

【讨论】：

我也这样做了，但没有任何变化。我是否必须创建一个 .apk 才能看到更改，而不是在 Chrome 上预览？
这在您的浏览器中不起作用，因为您使用的是cordova。

【解决方案2】：

.scss

.toolbar-background{
  background-color:#7e6cfc;
}

【讨论】：