Css 如何从离子4中的离子项目中删除白色背景?

Css 如何从离子4中的离子项目中删除白色背景?,css,ionic-framework,ionic4,Css,Ionic Framework,Ionic4,我在设计我的ionic 4移动应用程序布局时遇到了巨大的问题。我花了一段时间才找到如何为应用程序设置背景图像,但现在我在放置离子项目标签的地方得到了一个白色矩形。我试着设置离子项{background:transparent important!}(在scss页面中),但它不起作用。我是爱奥尼亚的初学者 register.page.scss :host { ion-content { --background:none; background: url('../../assets/imgs/ho

我在设计我的ionic 4移动应用程序布局时遇到了巨大的问题。我花了一段时间才找到如何为应用程序设置背景图像,但现在我在放置离子项目标签的地方得到了一个白色矩形。我试着设置离子项{background:transparent important!}(在scss页面中),但它不起作用。我是爱奥尼亚的初学者

register.page.scss

:host { ion-content {
--background:none;
background: url('../../assets/imgs/hoghi/bg.jpg')  no-repeat 100% 100%;
background-size: cover;
background-position: center center;

ion-item {
  background-color: transparent !important;
  background: transparent !important;
  opacity:1;
}//end of item}//end of content}//end of :host
register.page.html

<ion-content>
  <ion-item>
    <ion-label position="floating">Name</ion-label>
    <ion-input></ion-input> 
  </ion-item>
</ion-content>

名称

您应该尝试使用shadowdom变量来实现这一点

离子组件的样式可以使用这些变量进行自定义

获取有关离子项目的更多信息

以下代码将是:

离子项目{
--背景:无;
不透明度:1;
}


您总是可以在每个组件文档的页面末尾找到这些变量

是的,我知道“}”在register.page.scss的末尾有注释。我在格式化它们以适应代码块时遇到了问题。。感谢您的帮助!这真是妙不可言。。我会仔细查看你链接的页面,因为我读到爱奥尼亚4与以前的爱奥尼亚版本有不同的样式规则。非常有用。谢谢你,先生。