CODEWITHSUNDEEP
css
user3473475
user3473475

Reputation: 13

Background image in stylesheet won't appear

Hi I'm a new developer and I'm trying to build a portfolio site for myself. Anyway, I can't seem to get the background image I put together to show. The image is located in the images folder of my CSS folder. I notice if I try to put a background color in it works just fine. However, I don't want a background color just an image. enter image description here The file pathway in my project is as follows:

ProjectName > SiteRoot > CSS > images > hmebckgnd.jpg

This is my code for styles.css

body{
                background-image: url('/images/hmebckgnd.jpg');                  
                background-repeat: no-repeat;
                margin: 0;




            }

Upvotes: 0

Views: 46

Answers (2)

hywak
hywak

Reputation: 920

If your image has path like this: ProjectName > SiteRoot > CSS > images > hmebckgnd.jpg

why don't you include css directory in css file?

body{
                background-image: url('../images/hmebckgnd.jpg');                  
                background-repeat: no-repeat;
                margin: 0;

            }

It is good practice to use relative path in css file and load whole css file with forward slash in your HTML file.

Upvotes: 0

Jesse Kernaghan
Jesse Kernaghan

Reputation: 4634

The first / in the path attempts to find the images folder from the root directory, removing it will load it relative to the directory the stylesheet is in (which should be the CSS folder):

body{
    background-image: url('images/hmebckgnd.jpg');                  
    background-repeat: no-repeat;
    margin: 0;
}

Upvotes: 1

Related Questions