如何在 home.page.scss 内的 angular + ionic 应用程序中设置背景图像？

【问题标题】：How to set background images in angular + ionic app inside home.page.scss?如何在 home.page.scss 内的 angular + ionic 应用程序中设置背景图像？
【发布时间】：2019-08-29 15:44:46
【问题描述】：

我是 angular plus ionic 4 框架，我通过 .scss 文件应用背景图像，但它无法正常工作。这是html和scss代码。

【问题讨论】：

试试：stackoverflow.com/questions/49380916/…

标签： angular sass ionic4

【解决方案1】：

由于您使用的是 Ionic 4，它使用了所谓的 Shadow DOM 技术，因此您只能使用变量访问某些元素，以便更改背景

ion-content {
 --ion-background: url('../asssets/...') !important; 
}

【讨论】：

【解决方案2】：

您的代码很好，我认为您需要做的就是删除 page-home{}

SCSS 不能引用包含 scss 的组件的选择器，在 ionic 4 中

【讨论】：

【解决方案3】：

SASS 变量

IONIC 4 现在正在使用 sass 变量，因此您可以尝试使用：

ion-content{
    --background: #fff url('assets/abc.png') no-repeat center center / cover;
}

【讨论】：