在磁盘上访问页面时，如何在HTML文档中引用图像？

Question

我在硬盘上本地创建并部署了一个网页，发现没有任何工作正如我预期的那样。我网站的所有代码都采用以下格式：

default.html中 images / tpc / .... [所有图片在这里] js / [所有js文件在这里]

我的HTML看起来像这样：

 <li>
    <a href="javascript:void(0)">
        <img alt="" height="16" src="/images/tpc/slide-butn.png" width="15">
    </a>
 </li>

这会产生问题，当另一个人从他们自己的磁盘打开default.html页面时，我想图像链接被称为：

file:///C:/images/tpc/slide-butn.png

我有什么办法可以解决这个问题吗？

Answer 1

您是否尝试过相对网址？

<img alt="" height="16" src="images/tpc/slide-butn.png" width="15">

Answer 2

尝试使用相对路径：

src="images/tpc/slide-butn.png" 

（首先省略斜线）

Answer 3

大多数网站都需要使用网络服务器进行测试，而不仅仅是打开随机文件。可能没有办法“修复”它，以便您可以直接打开文件。如果URL以“/”开头，那么它相对于提供文件的域，其效果可能与相对URL不同，具体取决于域相对URL显示在哪个文件上。我的建议是开发一种测试网站的标准机制，例如可以启动与真实网站类似配置的演示网络服务器的命令，或者某些共享测试服务器。

请注意，即使您将所有内容更改为相对URL，在遇到Web服务器设置的标头，Cookie，任何类型的动态或解释页面，mime类型等时，如果您遇到类似问题，也会遇到类似问题。只是打开文件而不是使用测试Web服务器，所以现在不妨咬紧牙关。

Answer 4

您需要删除前导斜杠并将网址设置为相对于文件保存位置。

例如，如果您的图像位于html文件所在目录中名为images的目录中，则正确的URL将是

<img alt="" height="16" src="images/tpc/slide-butn.png" width="15">

这表示您在与文件相同的目录中的images目录中查找。使用前导斜杠，浏览器将查看根目录。非常适合网站，而不是本地目录。

relative and absolute urls上的这篇文章可以为您提供更好的解释。