链接单独文件夹中的图像

时间:2013-08-12 22:55:55

标签: html file navigation structure

我一直在使用一些朋友代码,他的大多数图像都被称为:

<img src="/uploads..."> //the '/' before the folder in the src isn't allowing me to link to the images.

我知道这对大多数人来说可能是一个非常简单的问题,但我似乎无法正确链接图像。我的文件结构如下:

project folder>two folders (uploads) & (code) 

现在,如果我在'code'文件夹中有我的html,并且我正在尝试链接到'uploads'文件夹中的所有图片,我应该如何重新构建我的文件以便它们链接?我已经尝试将html放在“项目文件夹”下的根目录中,但它仍然没有链接到上传中的图像。

关键是我不想在html中的每个src中取出'/',我希望我可以构建文件,这样它们就可以正确链接。

3 个答案:

答案 0 :(得分:1)

如果每个图片链接都是这样的:

/uploads/someFile.ext

然后,链接到的文件将需要位于Web服务器根目录中名为uploads的文件夹中。基本上上面的内容被翻译成:

http://server/uploads/someFile.ext

无论网页的网址是什么。

一般来说,这种事情是不受欢迎的,因为它要求网站在服务器/域/等的根目录中运行。如果您希望网站在子文件夹中运行,则需要将上述绝对路径更改为相对路径:

./uploads/someFile.ext

告诉浏览器将链接附加到当前文档的当前URL“文件夹”(我使用松散的术语,但你明白了)。因此,如果页面的URL类似于:

http://server/someFolder/anotherFolder/index.html

然后将相对于:

创建图像链接
http://server/someFolder/anotherFolder/uploads/someFile.ext

从长远来看,最好的办法是相应地更新所有链接。绝对路径(您目前拥有的路径)只应在有真正令人信服的理由使用时使用。尽可能使用相对路径。

作为快速修复,只要uploads文件夹位于URL域的根目录中,它就可以正常工作。

答案 1 :(得分:1)

尝试:

<img src="./uploads/yourimage.ext">

或:

<img src="uploads/yourimage.ext">

答案 2 :(得分:1)

您可以通过src属性中的绝对或相对路径来完成。

绝对值:

http://example.com/uploads/example.png

相对

./../uploads/example.png

相对的例子是我们将“代码”视为您当前的目录。

./ - is a current dir
./../ - is one dir back from current dir
./../uploads/ - is one dir back from current dir, and switch to uploads dir