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

o7jaxewo 于 2022-12-08 发布在 Ionic

关注(0)|答案(1)|浏览(171)

我有一个离子内容，我需要把一个背景图像有50%的不透明度。
我的欢迎组件html

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

我的欢迎组件scss

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

背景图像显示，但没有不透明度。我如何修复它？我使用离子v6与Angular

1条答案

使用css阴影部分background：

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