如何在Ionic v6中设置背景图像的不透明度

Question

我有一个离子内容，我需要在那里放置一个不透明度为50%的背景图像

欢迎组件html

<ion-content>
<ion-grid>
<ion-row>
...

欢迎组件scss

ion-content
{
--background: url(splash1.png) no-repeat center center / cover;
--background-opacity: 0.5;
}

显示背景图像，但没有不透明度。我怎样才能修好它?使用Angular的Ionic v6用户

Answer 1

使用css阴影部分background:

ion-content
{
--background: url(splash1.png) no-repeat center center / cover;
}
ion-content::part(background)
{
opacity: 0.5;
}