离子导航条背景图像没有出现 - 仅显示白色 - 离子3

时间:2017-07-24 01:09:10

标签: html css image ionic-framework background

我有ion-header这样的部分:

<ion-header (swipeRight)="toProfile()">
  <ion-navbar #clickme class="itemadspace" [@slideDown]="downState" no-lines no-padding>
    <h3 class="feedtitle">Stylist Feed</h3>
    <div (tap)="loadPost()" class='pluscontainer'>
      <ion-icon class='plussy' name="add"></ion-icon>
    </div>
  </ion-navbar>

  ...

</ion-header>

ion-navbar的CSS是itemadspace类:

    .itemadspace {
        z-index: 1;
        position: fixed;
        top: 0;
        left: 0;
        background-image: url('../../assets/tresemme.png');
        background-repeat: no-repeat;
        background-size:cover;
        text-align: center;
    }

没有图像显示,ion-navbar组件的背景为白色。知道如何让背景图像工作吗?

1 个答案:

答案 0 :(得分:2)

而不是添加一个s类。你可以覆盖主题。 您可以在底部的variable.scss中添加此代码。

ion-header{
    ion-navbar{
        div.toolbar-background{
             background-image: url('../../assets/tresemme.png');
             background-repeat: no-repeat;
             background-size:cover;
             text-align: center;
        }
    }
}