user3433278
user3433278

Reputation: 33

Include a local picture in CSS

I'm trying to build my first website as a hobby project using XAMPP. I have absolutely minimum knowledge about coding, but I'm enjoying it and I feel like I'm actually learning. However, now I have a problem I can't seem to figure out.

I'm trying to include a background image in my CSS file and it's working fine when I use a link to a website, like the example below.

#page-body{
    background: url('https://upload.wikimedia.org/wikipedia/commons/3/3a/Monza_banking_2003.JPG');
    background-Repeat: no-repeat;
    background-Position: center;
    background-size: cover;
}

However when I try to include the image in my folder images folder, it won't load. The pad to the images folder is the following: C:\xampp\htdocs\site\en\images

#page-body{
    background: url(.\images\background.png);
    background-Repeat: no-repeat;
    background-Position: center;
    background-size: cover;
}

I'm sure I'm making a mistake somewhere, but I can't seem to figure out where I went wrong any help or suggestions would be much appreciated!

Upvotes: 0

Views: 74

Answers (1)

rpd
rpd

Reputation: 38

Make sure you have apostrophes around the file path '_ _ _' inside the brackets.

Also, by using the full stop at the beginning of the path, were you intending to go up one directory? If so you actually need to use two fullstops.

eg. background-image: url('../images/background.png');

Upvotes: 1

Related Questions