How to set ion-content background image

1
votes

I am trying to set an image as the background for ion-content element, but always got on error:

./src/pages/public/home/home.style.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-4-1!./node_modules/postcss-loader/src??postcss!./src/pages/public/home/home.style.css) Error: Can't resolve '/assets/images/logo.png' in 'd:\CityInfo\development\mobileUI\src\pages\public\home'

My css class:

ion-content
{
    --background: none;
    background-image: url("/assets/images/logo.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;;
}
1
cssionic-frameworkionic5
I presume there is an /assets/images folder on the path referenced and within it there is a logo.png which has read permission enabled? – E. Maggini
if I put that image as an IonImg src then it is working, but when it is in css, it's not working. – Wasyster
Set --background: url(../../../assets/images/logo.png); – Ravi Ashara

1 Answers

0
votes

Yes, you can play with the path and the dots, my guess is this one, because the assets folder is nested three folders behind, I guess:

background-image: url("../../../assets/images/logo.png");