CODEWITHSUNDEEP
htmlcss
Sravan Gereddy
Sravan Gereddy

Reputation: 87

Unable to apply CSS for body of a HTML document

I am unable to apply a background image in my HTML document using the following code in CSS:

body
    {
        text-align:center;
        background-image:url('C:\wamp\www\marks display\WI71.jpg');
    }

I also searched for it, but I found, the above declaration is true but unable to execute it. Why is this happening?

Upvotes: 2

Views: 106

Answers (4)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201758

The string C:\wamp\www\marks display\WI71.jpg does not comply with URL syntax. To begin with, the character \ as such is not allowed in URLs; it should be replaced by the slash /. The space character should be %-encoded as %20. Finally, to refer to a file in the local system with a pathname, use a file: URL:

background-image:url('file:///C:/wamp/www/marks%20display/WI71.jpg');

However, IE has very permissive error recovery here, so your malformed code actually works on IE, if the file exists in the place indicated with the name given. Other browsers require correct code (mostly).

Such URLs are of very limited usefulness. They mostly work in local testing only, and even in local testing, it is better to use URLs that are relative to the location of the HTML document. This way, you can use the same code in local testing and on a web server, provided that you replicate the relevant parts of the folder structure.

Upvotes: 0

Yograj Gupta
Yograj Gupta

Reputation: 9869

Path should not be map to a drive(file path) when publishing on web, it should be a URL.

It should be like background-image:url('http://domainname/71.jpg'); -- Complete Url of Image

or background-image:url('WI71.jpg'); -- Relative url

Upvotes: 1

Isank
Isank

Reputation: 86

buddy html css in reality is actually a on server thing so below is the right code:

background-image: url('c:/xyz/xyz/sample.jpg');

however if you are uploading your site on a real web server do not gives paths like that, just make it like below

background-image: url('foldername_if required/imagename');

Upvotes: 0

egrunin
egrunin

Reputation: 25073

That's not a URL, that's a file path.

If the root of your site is marks display, probably you want this:

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

Upvotes: 7

Related Questions