正确使用图像文件中的相对路径答案

【问题标题】：Correctly using relative path in image file正确使用图像文件中的相对路径
【发布时间】：2014-11-10 10:27:00
【问题描述】：

从我的开发生涯一开始，就一直让我感到困惑的是相对路径和绝对路径。

现在我以 URL 的方式理解它，如果您要访问同一服务器上的网页，则使用相对路径，如果页面位于不同的（外部）服务器上，则需要使用绝对路径路径，即http://www.google.com。但我从来没有从文件的方式上理解它。

示例和我的问题。

我正在构建一个 HTML 电子邮件类，它将图像作为 img 作为横幅发送

 builder.AppendLine("<img src=C:\Images\\MailBanner.jpg\" alt=\"banner\">");

现在如果我像上面那样使用绝对路径，图像就会显示出来。

但是，当我将站点部署到我们的 Web 服务器上时，当然，该图像不在 C: Drive 中，因此该图像不会出现在电子邮件中。那么我需要将\..\ 放在哪里？

是否作为项目中网络服务器上存储图片的点？

我猜你可能需要更多信息然后我已经发布但我可能需要一些解释。

谢谢

【问题讨论】：

标签： html relative-path

【解决方案1】：

只需将图像放在项目文件夹下的文件夹 images 中，您的代码将是：

builder.AppendLine("<img src=\"\images\MailBanner.jpg\" alt=\"banner\">");

你的图片路径是：

/project/images/MailBanner.jpg

您的项目通常位于您的网络服务器文件夹的www 文件夹下。

【讨论】：

【解决方案2】：

在您的项目中设置一个 images 文件夹并修复您的 src 属性：

builder.AppendLine('&lt;img src="images/mailbanner.jpg" alt="banner"&gt;');

编辑：您的问题是您的 javascript 代码。您需要在标签前后使用撇号，并为 img 标签的属性使用引号。否则你的 javascript 无法理解你的属性是什么。

【讨论】：

【解决方案3】：

我更喜欢主要使用相对路径，因为当您将数据从本地位置移动到 Web 服务器时，只要目录结构没有改变，什么都不会中断。但是，操作系统也很重要。
例如，我可以看到您的文件是从 Windows 服务器移动的。因此，除非您将其移至另一台 Windows 服务器并且驱动器号相同，否则您的绝对路径已损坏。

如果文件被移动到具有完全相同目录结构的 Windows 服务器：

builder.AppendLine('<img src="C:\Images\MailBanner.jpg" alt="banner">');

如果文件被移动到 linux 服务器：

www/images

builder.AppendLine('<img src="/Images/MailBanner.jpg" alt="banner">');

注意：第一个正斜杠非常重要。 / 告诉 Apache 该目录位于文档根目录 (www) 中。如果没有/，Apache 期望该目录位于文件/脚本所在的当前目录中。将文件从 Windows 移动到 Linux 时的另一个重要考虑因素是 Linux 区分大小写。 /Images/MailBanner.jpg 与 images/mailbanner.jpg 不同。

【讨论】：