Question

我正在使用面向Android设备的ionicV4创建一个简单的应用程序。

当我在首页上为<ion-content>部分添加背景图片时。它在Chrome上可以完美显示，但在使用devApp以及作为APK编译并安装后，却无法在android设备上显示。仍然没有显示背景。

这是我的home.page.html：

<ion-header>
  <ion-toolbar color="dark">
    <ion-buttons slot="start">
      <ion-menu-button></ion-menu-button>
    </ion-buttons>
    <ion-title>
      Home
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
  <div align="center" style="margin-top: 1px;margin-left: 15px;margin-bottom: 60px;">
<img src="../assets/imgs/logo.png">
    </div>
    <div align="center" style="background-color:white;margin-left:50px;margin-right:50px;opacity: 0.7;border-radius: 25px;">
<div style="padding:5px;">
    <img src="../assets/imgs/dress.png" style='width:100px;height:100px;'><br>
    <b>Buy/Rent Dress</b>
    </div>
</div><br>
<div align="center" style="background-color:white;margin-left:50px;margin-right:50px;opacity: 0.7;border-radius: 25px;">
<div style="padding:5px;">
<img src="../assets/imgs/add.png" style='width:100px;height:100px;'><br>
<b>Add dress for sale/Rent</b>
</div>
</div><br>
<div align="center" style="background-color:white;margin-left:50px;margin-right:50px;opacity: 0.7;border-radius: 25px;">
<div style="padding:5px;">
<img src="../assets/imgs/user.png" style='width:100px;height:100px;'><br>
<b>Manage your account and ads</b>
</div>
</div>

</ion-content>

还有home.page.scss文件：

ion-icon {
  font-size: 64px;
}


ion-content {
  --background: url('/assets/imgs/background.jpg')  no-repeat 110% 50%;
}

如您所见，还有许多其他图像在浏览器和设备上都能完美显示。正如从.html文件中调用它们一样，但是.scss中唯一被调用的图像未在移动设备上显示。

<ion-content>背景显示在浏览器上，但不显示在设备（Devapp）上

0 个答案: