Css 如何从任何页面更改菜单背景4

我想为每个页面更改不同的离子菜单背景，但它不起作用：

ion-menu ion-content{
     --background: #59d36d;
} 

app.component.html:

  <ion-split-pane contentId="main-content">
    <ion-menu contentId="main-content" type="overlay">
      <ion-content class="app-content" part="placeholder">
        <ion-list id="inbox-list">
          <ion-list-header lines="full">
            <ion-avatar >
              <ion-img [src]="'./assets/logo.png'"></ion-img>
            </ion-avatar>
             Pyramid to True Love
          </ion-list-header>
          <ion-menu-toggle auto-hide="false" *ngFor="let p of appPages; let i = index">
            <ion-item (click)="selectedIndex = i" routerDirection="forword" [routerLink]="[p.url]" lines="none" detail="false" >
              <ion-icon slot="start" [ios]="p.icon + '-outline'" [md]="p.icon + '-sharp'"></ion-icon>
              <ion-label>{{ p.title }}</ion-label>
            </ion-item>
          </ion-menu-toggle>
        </ion-list>
     </ion-app>

任何.page.scss（不工作）：

可能吗？

你可以这样使用， 参考：

ion-menu ion-content{
     --background: #59d36d;
} 

ion-menu {
  --ion-background-color: var(--ion-color-primary);
  --ion-text-color: var(--ion-color-primary-contrast);
}