所以我有一个带有半透明离子头和全屏离子内容的离子页面。
问题是在覆盖官方网站上提到的 ion-content 时不会应用 CSS 上的更改,并且在渲染后将默认样式应用于 ion-content
page.html
<ion-content [fullscreen]="true">
<ion-grid fixed id="mainGrid">
<ion-row>
<ion-col size="12">
<h1>Hola</h1>
<h3>Eu ex ipsum anim voluptate dolor.</h3>
</ion-col>
</ion-row>
</ion-grid>
</ion-content>
页面.scss
ion-content {
--offset-top: 0;
}
以下是渲染应用程序后的标签:
<ion-header _ngcontent-uhx-c139="" class="ion-no-border primary md header-md header-translucent header-collapse-none header-translucent-md hydrated" ng-reflect-translucent="true" role="banner">...</ion-header>
<ion-content _ngcontent-uhx-c135="" style="--offset-top:56px; --offset-bottom:56px;" ng-reflect-fullscreen="true" class="md hydrated">...</ion-content>