将图像添加到标题并使用图像作为按钮

时间:2017-06-12 04:34:58

标签: css cordova ionic2

我在浏览器中添加了一个图片到我的标题和我按钮,我能够正确查看它,但是抱怨我使用cordova run android将应用程序运行到我的手机上 在我的标题中,我看不到图像,我得到一个空白区域,还有按钮的空间,但没有图像可见,但点击它时执行功能。

<ion-header color="dark" >
    <ion-navbar>
        <ion-title>
            <ion-row>
                <ion-col col-1>
                    <img  src="assets/img/logo.png" > 
                </ion-col>
                <ion-col style="padding-top: 19px;" col-5>
                   My title
                </ion-col>
            </ion-row>
        </ion-title>
        <ion-buttons end>
            <button ion-button icon-only>
                 <ion-icon name="log-out" (click)="logout()"></ion-icon>
            </button>
        </ion-buttons>
    </ion-navbar>
</ion-header>

<ion-content>
 <ion-row>
        <ion-col style="padding-left: 45%;">
            <p>Choose language</p>
        </ion-col>
        <ion-col width-10>
            <button (click)="changeItaly()" clear ion-button>
                 <ion-icon name="italyFlag"></ion-icon>
            </button>
        </ion-col>
        <ion-col>
            <button (click)="changeEnglish()" clear ion-button>
                <ion-icon name="englishFlag"></ion-icon>
            </button>
        </ion-col>
    </ion-row>
</ion-content>

CSS

.ion-ios-customicon,
.ion-md-customicon {
  content: url(../../assets/img/ui/logo.png);
  width: 32px;
  height: 49px;
  padding: 6px 4px 2px;
  opacity: 0.9;
}
.ion-ios-italyFlag,
.ion-md-italyFlag {
  content: url(../../assets/img/ui/italy.png);
  width: 49px;
  height: 32px;
  padding: 6px 4px 2px;
  opacity: 0.9;
}
.ion-ios-englishFlag,
.ion-md-englishFlag {
  content: url(../../assets/img/ui/english.png);
  width: 49px;
  height: 32px;
  padding: 6px 4px 2px;
  opacity: 0.9;
}

enter image description here

  

我能够在浏览器中看到这些图像,但我无法在手机中看到它们。有人可以帮我吗

0 个答案:

没有答案