How To Add Background Image In Ionic 4

 the background image on ion-content

ion-content {
  --background: url(../../assets/images/bg4.jpg) 0 0/100% 100% no-repeat !important;
  background-color: #fff;
}

background image on some custom tag like div etc.

 

   div{
       background: url(/assets/images/react.svg) 0 0/100% 100% no-repeat !important;
     }

background image on full page (header, ion-content,footer)

Example If your page name is setting then use this scss

app-setting {
 background: url(./assets/images/bg4.jpg) no-repeat center center / cover; 
  ion-header {
    ion-toolbar {
      --background: transparent;
    }
  }

  ion-content {
    --background: transparent;
  }


}
Also Read 

 

Leave a Comment