0

For example in CSS

background-image: url('C:\Users\Narendra\Documents\myfile/23.jpg');

(I am still learning CSS) In my case a image will only load through index.html if I put (src="") However not with url. Is it a problem with my source path or the codes?

ROMANIA_engineer
  • 54,432
  • 29
  • 203
  • 199
Narendra
  • 3
  • 1
  • 3
  • possible duplicate of [CSS background image URL failing to load](http://stackoverflow.com/questions/6401865/css-background-image-url-failing-to-load) – Josh KG Nov 24 '14 at 20:24

4 Answers4

0

because of the browser related security issues , you cannot do that. Browsers tend to raise eyebrows and yell at you for doing that. Thats is why you have to give relative path ( in relation to your server root). The reason being when you provide absolute path, it is all good if you are using the browser in your own computer ( although chrome would scoff at you for that) but if you access the same page from a diff computer then it tries to look for that file in that local c: drive.

So long story short, it wont work if you want it to perform across different browsers

Sai
  • 1,889
  • 5
  • 18
  • 26
  • Thank you for explaining. At the moment I am practising and learning to build websites on my computer and my only source is my computer. therefore now since I cannot use computer path for url image then what could be the best option. – Narendra Nov 24 '14 at 20:05
  • to learn website building/html/css and stuff in general it would be great if you do it with a webserver so that you get to know all the intricacies that involves with files and stuff. If you have windows then IIS comes with windows. If that is not an option google 'xampp webserver' and install it. – Sai Nov 24 '14 at 20:09
0

You can use...

background-image: url('http://somewhere.com/whatever-image.jpg');

But it would be better to have the image in your folder structure somewhere. If you have an img folder for example...

background-image: url('../img/whatever-image.jpg');

Path needs to be relative to your stylesheet ( ../ goes back a folder ). You wouldn't have src in the css, thats for html.

Hope that helps

Geoff
  • 317
  • 5
  • 16
0

You can try this code

body{background-image:url("file://C:\Users\Tim\Desktop\beige001.jpg");}

This code works fine in internet explorer, but not in Chrome.

Refer http://www.overclock.net/t/1249732/css-background-image-using-local-file

0

CSS:

.thisElement {
    background-image: url('/img/backgrounds/image.jpg');
    }

HTML:

<body class="thisElement">...</body>

Use the CSS class/id to call your image and then create the element you want the image to be on (div, header, body, etc) and add that class/id to the element.

CSS Class and ID examples:

Class Example:

.thisClass {
        background-image: url('/img/backgrounds/image.jpg');
        }

ID Example:

#thisID {
                background-image: url('/img/backgrounds/image.jpg');
                }

HTML example calling the css

<div class="thisClass">...</div>
<div id="thisID">...</div>