ionic4 背景图像/颜色不显示答案

【问题标题】：ionic4 background image/color is not show upionic4 背景图像/颜色不显示
【发布时间】：2019-02-13 04:09:06
【问题描述】：

我正在尝试设置背景图像或背景颜色，但它没有出现背景图片 - 网址上有错误背景颜色 - 不出现错误但也不出现背景...

scss:

:host{
    ion-content.bg-image{
        background: url('assets/homebackround.jpg') no-repeat 100% 100%;
    }
}

html:

<ion-header>
  <ion-toolbar>
    <ion-title>
      ionic4
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content class="bg-image" no-scroll padding>
  
</ion-content>

【问题讨论】：

[ng] 模块错误（来自 ./node_modules/postcss-loader/src/index.js）：[ng]（发出的值而不是错误的实例） CssSyntaxError: C:\Users\ This_User\catch\src\app\home\home.page.scss:3:20: 无法解析 'C:\Users\This_User\catch\src\app\home' 中的 'assets/homebackround.jpg' [ng ] 1 | :主机{[ng] 2 | ion-content.bg-image{[ng] > 3 | --backgroung: url('assets/homebackround.jpg') 无重复 100% 100%; [ng] | ^ [ng] 4 | } [ng] 5 | } [ng] [ng] i ｢wdm｣: 编译失败。
你能检查一下你是否给了正确的图像路径和正确的图像名称，因为上面的错误是不能解析'assets/homebackround.jpg'
如果路径正确，则尝试路径为 '../assets//homebackround.jpg'
我检查了路径是真的，我也试过你写的路径还是一样的错误

标签： html css angular ionic4

【解决方案1】：

你可以直接使用Ionic4给出的css属性和这是你如何使用它。

ion-content{
    --background: url('assets/homebackround.jpg') no-repeat 100% 100%;
}

这是stackblitz中的运行代码

【讨论】：

@s.k.看看我的答案所附的他的 stackblitz