png图像在css离子中使背景颜色变黑答案

【问题标题】：png image make background color black in css ionicpng图像在css离子中使背景颜色变黑
【发布时间】：2021-09-14 23:54:28
【问题描述】：

我正在使用带有 ionic 的 css。在背景中使用图像但是当我使用使背景变黑的图像时。没有图像它看起来很好。

ion-content {
    --background:  url("/assets/product_background.png") 0 0/100% 95% no-repeat;
--ion-background-color: linear-gradient(to bottom,  #1a1240 35%,#6528af 70%,#736eed 100%);
}

With Background image

without background image

【问题讨论】：

查看浏览器的开发工具，检查元素，看看是什么覆盖了什么。也许您可以将两个背景放在一起并跳过离子设置。

标签： html css ionic-framework sass ionic4

【解决方案1】：

只需将所有属性添加到 --background 值即可。

在你的情况下：

--background: url("/assets/product_background.png") 0 0/100% 95% no-repeat, linear-gradient(to bottom, #1a1240 35%, #6528af 70%, #736eed 100%);

这将添加您的图像，然后包含您的渐变。

【讨论】：