Как изменить цвет фона панели вкладок и значка вкладки в Ionic 4

Question

Я хочу знать, как изменить цвет фона этой вкладки на Ionic 4.

Я пытался добавить --background: white; в ion-tab / ion-tabs, но он не работает.

<ion-tabs>
  <ion-tab label="Home" icon="home" href="/tabs/(home:home)">
    <ion-router-outlet name="home"></ion-router-outlet>
  </ion-tab>
  <ion-tab label="About" icon="information-circle" href="/tabs/(about:about)">
    <ion-router-outlet name="about"></ion-router-outlet>
  </ion-tab>
  <ion-tab label="Contact" icon="contacts" href="/tabs/(contact:contact)">
    <ion-router-outlet name="contact"></ion-router-outlet>
  </ion-tab>
</ion-tabs>

Мне так любопытно узнать об этой новой Ionic 4 :( Пожалуйста, помогите ...

Answer 1

Вам необходимо добавить свойства, называемые цветом. Ionic 4 имеет предопределенные цвета:

• первичный
• Вторичный
• третичный

Больше информации в документации

Пример использования:

<ion-tabs main color="primary">

Answer 2

Ионная 4 +

ion-tab-bar, ion-tab-button{
 background-color: #ce0013;
}

ion-icon{
  color: #d7d8da;
}

Answer 3

Дайте ion-tab имя класса, подобное

<ion-tab class="tab"></ion-tab>

Теперь в файле scss укажите цвет фона для класса с именем tab

.tab{
   background-color: white;
}