Ionic 2 - Adding a Background Image to a Page

Question

I just installed a new Ionic project - Ionic v2.0.0-beta.32

I want to add a background image to the home page of a new installation, is there anyone who can show me how I do this? All I can find is information for Ionic 1, and everything seems completely different.

From the found ive image should be the following sizes

2800px x 2800px

But apart from this, I cannot find any other lessons.

This is my first Ion project, so be careful

Thank you guys,

Answer 1

Image can be any size.

go to app/theme/app.core.scssand add the following code

ion-content{
    background-image: url('img/background.jpg');
}

, background.jpg www/img/.

,

UPDATE Ionic 3.x

app/app.scss

ion-content {
    background-image: url('assets/img/background.jpg');
}

, background.jpg assets/img.

Answer 2

Ionic V4 scss. :

ion-content {
  --background: url('../../assets/Welcome-screen.png')  no-repeat 50% 10%;
}

Answer 3

In ionic 2, the background image only works if you put the img folder in the build folder. If you go look at the mage’s URL, it will show you that I will find it in the build / img / bg.jpg file to install the img folder in the folder folder.

Www / build / img