meranda2100 Posted March 11, 2009 Share Posted March 11, 2009 I am new to CSS and am having trouble getting a background image to display in a stlye sheet. I am trying to use an image that is saved on my computer, not on the web. I can get it to work in html (in HTML-Kit) with this code:<body background="../../Public/Pictures/Sample%20Pictures/Garden.jpg">but when I try it in a style sheet:body {background-image:('../../Public/Pictures/Sample%20Pictures/Garden.jpg')} it doesn't work. I would appreciate any help and any info on images in general. Thanks, Meranda2100 Link to comment Share on other sites More sharing options...
jarrett000 Posted March 11, 2009 Share Posted March 11, 2009 Well, first of all try this code; background-image: url('../../Public/Pictures/Sample%20Pictures/Garden.jpg') Link to comment Share on other sites More sharing options...
meranda2100 Posted March 11, 2009 Author Share Posted March 11, 2009 Well, first of all try this code;background-image: url('../../Public/Pictures/Sample%20Pictures/Garden.jpg') No. That didn't work. It doesn't have a url-it is saved in my hard drive, under my pictures folder. Any other ideas? Link to comment Share on other sites More sharing options...
jlhaslip Posted March 11, 2009 Share Posted March 11, 2009 For simplicity, move the image into the same folder as the page to see if you can connect to it without the complex folder reference.This will at least get it to work locally.Also, the image needs to be on the web for a live site to use it. You can not link to the image on your hard drive from the web. Link to comment Share on other sites More sharing options...
meranda2100 Posted March 12, 2009 Author Share Posted March 12, 2009 For simplicity, move the image into the same folder as the page to see if you can connect to it without the complex folder reference.This will at least get it to work locally.Also, the image needs to be on the web for a live site to use it. You can not link to the image on your hard drive from the web.Thank you very much. I put the image in the same folder on my hardrive and put the image online, it worked!Meranda2100 Link to comment Share on other sites More sharing options...
Ingolme Posted March 12, 2009 Share Posted March 12, 2009 When you reference an image from a stylesheet, the URL has to be relative to the location of the stylesheet, not the HTML page. Link to comment Share on other sites More sharing options...
meranda2100 Posted March 12, 2009 Author Share Posted March 12, 2009 When you reference an image from a stylesheet, the URL has to be relative to the location of the stylesheet, not the HTML page.Thanks. I'll give it a try.Meranda 2100 Link to comment Share on other sites More sharing options...
meranda2100 Posted March 12, 2009 Author Share Posted March 12, 2009 Thanks. I'll give it a try.Meranda 2100I did try, but I still cannot get the image to display with CSS. With the code in HTML;<body background="http://www.geocities.com/meranda210051/Garden.jpg">it works, not with a stylesheet.I tried:body {background-image:http://www.geocities.com/meranda210051(...rden.jpg')}andbody {background-image:http//www.geocities.com/meranda210051/style1.css('garden.jpg')}I loaded the stylesheet online and tried<link rel="stylesheet" type="text/css"href="http://www.geocities.com/meranda210051/style1.css"><link rel="stylesheet"type"text/css" href="style1.css">in the HTML code (on the main page)- still the image doesn't display.Any ideas?Meranda 2100 Link to comment Share on other sites More sharing options...
jlhaslip Posted March 12, 2009 Share Posted March 12, 2009 Try: http//www.geocities.com/meranda210051/garden.jpg*wait*I am getting a DNS error on that link.Do you have a link for us to check, please. Link to comment Share on other sites More sharing options...
meranda2100 Posted March 13, 2009 Author Share Posted March 13, 2009 Try: http//www.geocities.com/meranda210051/garden.jpg*wait*I am getting a DNS error on that link.Do you have a link for us to check, please.I tried this link-I am able to get the picture to appear in the web.Here's a link Link to comment Share on other sites More sharing options...
Tykain Posted March 13, 2009 Share Posted March 13, 2009 It should be {background-image: url('http://www.geocities.com/meranda210051/Garden.jpg')} or {background-image: url('Garden.jpg')} if the image is in the same folder as your css file. (It's better to use relative url when linking to something located on the same web site)And NOT {background-image:http//www.geocities.com/meranda210051/style1.css('garden.jpg')} . don't replace the "url" part with an actual url, that comes inside the () after "url". Link to comment Share on other sites More sharing options...
meranda2100 Posted March 13, 2009 Author Share Posted March 13, 2009 It should be {background-image: url('http://www.geocities.com/meranda210051/Garden.jpg')} or {background-image: url('Garden.jpg')} if the image is in the same folder as your css file. (It's better to use relative url when linking to something located on the same web site)And NOT {background-image:http//www.geocities.com/meranda210051/style1.css('garden.jpg')} . don't replace the "url" part with an actual url, that comes inside the () after "url".Thanks!!! That finally worked in my stylesheet.Meranda2100 Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.