67

假设以下是我网站的目录结构： 目录结构

现在index.html我可以简单地参考如下图像：

<img src="./images/logo.png">

但我想从sub.html. 应该是什么src？

4

7 回答 7

95

../images/logo.png会将您移回一个文件夹。

../../images/logo.png会将您移回两个文件夹。

/images/logo.png无论您身在何处，都会将您带回根文件夹/。

于 2010-09-07T00:42:51.260 回答
90

您可以使用相对路径引用图像：

<img src="../images/logo.png">
          __ ______ ________
          |    |       |
          |    |       |___ 3. Get the file named "logo.png"
          |    |
          |    |___ 2. Go inside "images/" subdirectory
          | 
          | 
          |____ 1. Go one level up

或者您可以使用绝对路径：/表示这是服务器上的绝对路径，因此如果您的服务器位于https://example.org/，/images/logo.png则从任何页面引用都将指向https://example.org/images/标志.png

<img src="/images/logo.png">
          |______ ________
          |    |       |
          |    |       |___ 3. Get the file named "logo.png"
          |    |
          |    |___ 2. Go inside "images/" subdirectory
          | 
          | 
          |____ 1. Go to the root folder
于 2010-09-07T00:42:10.007 回答
12

相对参考将是

<img src="../images/logo.png">

如果您知道相对于服务器根目录的位置，对于具有复杂嵌套目录层次结构的应用程序来说，这可能是最简单的方法 - 所有文件夹都相同。

例如，如果您的问题中描述的目录树相对于服务器的根目录，则 index.html 和 sub_folder/sub.html 都将使用：

<img src="/images/logo.png">

如果图像文件夹位于应用程序的根目录中，foo例如服务器根目录（例如http://www.example.com/foo）下方，则 index.html ( http://www.example.com/foo/index.html) 例如和 sub_folder/sub.html ( http://www.example.com/foo/sub_folder/sub.html) 都使用：

<img src="/foo/images/logo.png">
于 2010-09-07T00:50:47.000 回答
4

你的 index.html 可以做src="images/logo.png"，从 sub.html 你会做src="../images/logo.png"

于 2010-09-07T00:42:18.833 回答
2

../将您带到目录树上的一个文件夹。然后，选择适当的文件夹及其内容。

../images/logo.png
于 2015-06-25T10:36:33.570 回答
0

当您将文件上传到服务器时要小心，您的某些图像不会出现在网页上，并且会出现一个崩溃的图标，这意味着您的文件路径没有正确排列或编码当您具有以下文件结构时，代码应该像这样文件结构：->web（主文件夹）->images（子文件夹）->logo.png（子文件夹中的图像）上面的代码如下遵循这个标准 

 <img src="../images/logo.jpg" alt="image1" width="50px" height="50px">

如果您通过忽略文件结构而不创建文件夹 web 将文件上传到网络服务器如果您直接上传文件，那么您的图像将被破坏您看不到图像，然后更改代码如下

 <img src="images/logo.jpg" alt="image1" width="50px" height="50px">

谢谢-> vamshi krishnan

于 2016-12-03T05:29:20.017 回答
0

当您将文件上传到服务器时要小心，您的某些图像不会出现在网页上，并且会出现一个崩溃的图标，这意味着您的文件路径没有正确排列或编码当您具有以下文件结构时，代码应该像这样文件结构：->web（主文件夹）->images（子文件夹）->logo.png（子文件夹中的图像）上面的代码如下遵循这个标准

<img src="../images/logo.jpg" alt="image1" width="50px" height="50px">

如果您通过忽略文件结构而不创建文件夹 web 将文件上传到网络服务器如果您直接上传文件，那么您的图像将被破坏您看不到图像，然后更改代码如下

<img src="images/logo.jpg" alt="image1" width="50px" height="50px">

谢谢-> vamshi krishnan

于 2016-12-03T05:32:50.170 回答