Mapbox地图未全屏填充离子含量

Question

我正在尝试使用

使标题透明

<ion-header no-border>
  <ion-toolbar >
    <ion-buttons slot="start">
      <ion-menu-button color="primary"></ion-menu-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>
<ion-content fullscreen>
   <div id="map"></div>
</ion-content>

和.scss

中

ion-content{
  --ion-background-color: transparent;
}

ion-toolbar {
  --background: transparent;
  --color: white;
}

#map { 
  height: 100%;
  width: 100%;  
}

但是仍然具有id =“ map”的div不会全屏显示，无论如何我总是会得到这个

我该如何解决问题？

Answer 1

html.file

<ion-header>
  <ion-toolbar color="transparent">
    <ion-buttons slot="start">
      <ion-menu-button color="light"></ion-menu-button>
    </ion-buttons>
    <ion-title color="light" text-center>Sign In</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content fullscreen>
</ion-content>

css.file

ion-content{
   padding: 0px;
}