开发者

image url in CSS

I was just trying to change my site around a little, but I bumped into a problem which has never happened me before. I want to be able to test the site offline, so this problem is really annoying.

How come when i try to do this:

#logo{
    width:145px;
    height:41px;
    background:url('http://biscuithead.ie/images/logo.png') cente开发者_StackOverflow社区r no-repeat;                           
    display:block;
    float:left;
    cursor:pointer;
}

it works, but If I change the background line to:

background:url('/images/logo.png') center no-repeat;

or

background:url('images/logo.png') center no-repeat;

or

background:url(images/logo.png) center no-repeat;

or

background:url(/images/logo.png) center no-repeat;

it dosent work?

The image only seems to display through css when it is actually on the server

I am using DreamWeaver CS5.

Can anyone help we with this weird problem?


Be sure that the image file exists in your computer, and at the correct location.

Without the leading slash: images/logo.png is a path relative to the css file. If the css file is at /sites/example.com/css/styles.css, the image file must be at /sites/example.com/css/images/logo.png (inside the "css" folder)

With the leading slash: /images/logo.png is relative to the root folder of the site. If the css file is at /sites/example.com/css/styles.css, the image file must be at /sites/example.com/images/logo.png (inside the website root folder)


A colleague had this problem because he wasn't testing on a local web server, he was loading the pages in the browser using file://.


I have had image problems previously, My solution is to use Mac OSX's inbuilt Apache Server. It is very simple to enable, go to System Preferences, Sharing and Tick Web Sharing You can then place files/folders in the Sites Folder in your home folder. To Access these files open your web browser and go to localhost/~Username/ There is an article here that goes into more detail about the process http://www.devarticles.com/c/a/Apache/Using-Apache-and-PHP-on-Mac-OS-X/

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜