-1

I'm using XAAMP server for development
I'm trying to crate a parallax effect but the image home_image.png is not accessible from index.css.
I tried both ways from below but none of them are working.
Folder structure screenshot
Added image local path
Network console path trying to load

.img-1{
    background-image: url('/healtech/assets/images/home_image.png');
    position: relative;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 500px;
}
.img-2{
    background-image: url('../images/home_image.png');
    position: relative;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 500px;
}
<div class="img-1"></div>
<div class="img-2"></div>

I tried to create parallax effect but background image is not accessible from index.css :

1 Answers1

0

I Believe that Your URL address is not correctly linked to the pictures! You can use a relative path to fix this issue. For Example :

How to use relative/absolute paths in css URLs?

if you are defined this CSS class in your Index.css this will work correctly

background-image: url('../images/home_image.png');
Ali Kianoor
  • 1,167
  • 9
  • 18