Html CSS 中的图像 url
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6161016/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
image url in CSS
提问by Conor Taylor
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') center 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
当图像实际上在服务器上时,它似乎只通过 css 显示
I am using DreamWeaver CS5.
我正在使用 DreamWeaver CS5。
Can anyone help we with this weird problem?
谁能帮我们解决这个奇怪的问题?
回答by J. Bruni
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)
没有前导斜杠:images/logo.png
是相对于 css 文件的路径。如果 css 文件在/sites/example.com/css/styles.css
,则图像文件必须在/sites/example.com/css/images/logo.png
(在“css”文件夹内)
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)
带前导斜杠:/images/logo.png
相对于站点的根文件夹。如果 css 文件在/sites/example.com/css/styles.css
,则图像文件必须在/sites/example.com/images/logo.png
(网站根文件夹内)
回答by Kalessin
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://
.
一位同事遇到了这个问题,因为他没有在本地 Web 服务器上进行测试,而是使用file://
.
回答by Jason
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/
我以前遇到过图像问题,我的解决方案是使用 Mac OSX 的内置 Apache 服务器。启用非常简单,转到系统偏好设置、共享和勾选 Web 共享然后您可以将文件/文件夹放在您的主文件夹中的站点文件夹中。要访问这些文件,请打开您的 Web 浏览器并转到 localhost/~Username/ 这里有一篇文章详细介绍了该过程 http://www.devarticles.com/c/a/Apache/Using-Apache-and -PHP-on-Mac-OS-X/