Menu
My CSS file is in :
Project/Web/Support/Styles/file.css
My image is in :
Project/Web/images/image.png
I want this image in my CSS file.
I have tried :
1) background-image: url(/images/image.png); 2) background-image: url('/images/image.png'); 3) background-image: url("/images/image.png"); 4) background-image: url(../images/image.png); 5) background-image: url('../images/image.png'); 6) background-image: url("../images/image.png"); But. i'm not getting this image in my page.
What is the correct way to specify the path of image file in the css file ?
964
Usage is simple — you insert the path to the image you want to include in your page inside the brackets of url() , for example: background-image: url('images/my-image. png'); Note about formatting: The quotes around the URL can be either single or double quotes, and they are optional.
The most common & simple way to add background image is using the background image attribute inside the <body> tag. The background attribute which we specified in the <body> tag is not supported in HTML5. Using CSS properties, we can also add background image in a webpage.
HTML | <body> background Attribute. The HTML <body> background Attribute is used to specify the background-image for the document.
Your css is here: Project/Web/Support/Styles/file.css
1 time ../ means Project/Web/Support and 2 times ../ i.e. ../../ means Project/Web
Try:
background-image: url('../../images/image.png'); There are two basic ways:
url(../../images/image.png) or
url(/Web/images/image.png) I prefer the latter, as it's easier to work with and works from all locations in the site (so useful for inline image paths too).
Mind you, I wouldn't do so much deep nesting of folders. It seems unnecessary and makes life a bit difficult, as you've found.
34
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
