HTML 图像未显示，而 src url 有效答案

【问题标题】：HTML Image not displaying, while the src url worksHTML 图像未显示，而 src url 有效
【发布时间】：2013-08-24 01:07:04
【问题描述】：

<img class="sealImage" alt="Image of Seal" src="file:///C:/Users/Anna/Pictures/Nikon%20Transfer/SEALS%20PROJECT/j3evn.jpg">

不显示图像，仅显示 alt。但是如果我去

file:///C:/Users/Anna/Pictures/Nikon%20Transfer/SEALS%20PROJECT/j3evn.jpg

在浏览器中，图像显示。

我现在在 Windows 机器上的 xampp 上托管它。

我尝试过不同的浏览器，有无 %20 空间，但我知道 with 是正确的方法。（实际上两者都适用）

而且我知道图像只会在托管它的机器上可见，这不是问题。

【问题讨论】：

确保正如@William Yang 所发布的那样，您的图片位于托管网站的计算机上。将其弹出到您的 www 文件夹中，然后链接到 like：“src='j3evn.jpg'”，然后您就可以开始了。
是的，我也有同样的问题。绝对链接 _http://localhost/path/image.jpg 在浏览器中工作得很好，但在 src 标签中不起作用：|

标签： html image

【解决方案1】：

您的文件需要位于 www 目录中。例如，如果您在 Windows 上使用 wamp 服务器，则应定位 j3evn.jpg，

C:/wamp/www/img/j3evn.jpg

你可以通过 html 访问它

<img class="sealImage" alt="Image of Seal" src="../img/j3evn.jpg">

查找属于您的 Web 服务器的 www、public_html 或 html 文件夹。将所有文件和资源放在该文件夹中。

希望这会有所帮助！

【讨论】：

所以我没有移动图像，而是创建了一个软链接。我假设浏览器可以从托管目录外部访问它，这会很好。
@Scuzzball 不，你必须移动它们。 html、css 和 javascript 等所有资源都必须位于 xampp 的 www 目录中。
@Scuzzball 将其视为您的 xampp www 文件夹是您想要向世界展示的文件夹，而您的服务器/计算机上的所有其他文件夹都隐藏在视图之外。出于明显的安全原因，以这种方式完成。
是的，我明白这一点，但这是一个永远不会看到开放互联网的项目，我只是用 PHP 做的，因为这是我所知道的，而且快速完成很重要。它真的应该在别的地方完成。

【解决方案2】：

我的图片即使放在正确的文件夹中也没有显示，问题是他们没有正确的权限，我将权限更改为读写执行。我使用了 chmod 777 image.png。然后一切正常，图像开始显示。 :)

【讨论】：

这就是我的问题！谢谢我快把我逼疯了！
这种情况一直发生在我身上，因为我正在跨平台工作，部署到 linux VM。我想我已经来此评论 3 次了。

【解决方案3】：

因为您使用带有“file://”的 URL 链接，所以它不起作用。相反，您应该将您的目录与您的 HTML 文件相匹配，例如：

假设我的文件放置在：

C:/myuser/project/file.html

我想要的图片在：

C:/myuser/project2/image.png

我所要做的就是以这种方式匹配目录：

<img src="../project2/image.png" />

【讨论】：

【解决方案4】：

您可以尝试将图像放在源目录中。您可以通过将文件路径替换为 src="../imagenamehere.fileextension 来链接它，在您的情况下为 j3evn.jpg。

【讨论】：

【解决方案5】：

我的问题是图片名称前没有包含 ../

background-image: url("../image.png");

【讨论】：

【解决方案6】：

简单的解决方案是：

1.将图片文件和HTML文件放在同一个文件夹中。

2.code:<img src="Desert.png">//你的图片名称。

3.将文件夹保存在D盘。

将文件夹保留在桌面（即c盘）上，您可能会遇到权限问题。

【讨论】：

【解决方案7】：

把图片文件夹的名字改成img，然后使用HTML代码

【讨论】：

【解决方案8】：

我的问题是路径前面有/（assets 是一个目录），比如：

<img src="assets/images/logo.png>" 是正确的，而

<img src="/assets/images/logo.png>" 返回错误。

【讨论】：

【解决方案9】：

在你的 angular.json 文件夹结构应该是这样的

"assets": [             
  "src/assets",
  "src/favicon.ico"
],

不是这个

"assets": [     
  "src/favicon.ico",
  "src/assets",
],

这解决了我的问题。

【讨论】：

这个答案似乎与原始问题无关，也似乎没有回答它。