HTML:图像不会显示? [英] HTML: Image won't display?

问题描述

我对 HTML 有点陌生.我试图在我的网站上显示一个图像，但由于某种原因，它只显示一个带有问号的蓝色框.我在互联网上到处寻找，但似乎没有一个解决方案适合我.我试过了:

I'm kind of new to HTML. I'm trying to display an image on my website but for some reason, it just shows a blue box with a question mark in it. I've looked everywhere on the internet, but none of the solutions seemed to work for me. I've tried:

<img src="iwojimaflag.jpg"/>

<img src="images/iwojimaflag.jpg"/>

<img src="Applications/MAMP/htdocs/Symfony/src/Acme/WebBundle/Resources/public/images/iwojimaflag.jpg"/>

推荐答案

只是为了扩展niko的回答:

您可以通过其 URL 引用任何图像.不管它在哪里，只要它是可访问的，你就可以将它用作src.示例:

You can reference any image via its URL. No matter where it is, as long as it's accesible you can use it as the src. Example:

相对位置:

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

搜索图像相对于文档的位置.如果您的文档位于 http://example.com/site/document.html，则您的 images 文件夹应位于 document.xml 所在的同一目录中.html 文件是.

The image is sought relative to the document's location. If your document is at http://example.com/site/document.html, then your images folder should be on the same directory where your document.html file is.

绝对位置:

<img src="/site/images/image.png">
<img src="http://example.com/site/images/image.png">

或

<img src="http://another-example.com/images/image.png">

在这种情况下，将从文档站点的根目录寻找您的图像，因此，如果您的 document.html 位于 http://example.com/site/document.html，根将在 http://example.com/(或者它是服务器文件系统上的相应目录，通常是 www/代码>).前两个示例是相同的，因为它们都指向同一主机，将第一个 / 视为服务器根目录的别名.在第二种情况下，图像位于另一个主机中，因此您必须指定图像的完整 URL.

In this case, your image will be sought from the document site's root, so, if your document.html is at http://example.com/site/document.html, the root would be at http://example.com/ (or it's respective directory on the server's filesystem, commonly www/). The first two examples are the same, since both point to the same host, Think of the first / as an alias for your server's root. In the second case, the image is located in another host, so you'd have to specify the complete URL of the image.

关于/、.和..:

Regarding /, . and ..:

/ 符号将始终返回文件系统或站点的根目录.

The / symbol will always return the root of a filesystem or site.

单点./指向你所在的同一个目录.

The single point ./ points to the same directory where you are.

双点 ../ 将指向上层目录，或者包含实际工作目录的目录.

And the double point ../ will point to the upper directory, or the one that contains the actual working directory.

因此您可以使用它们构建相对路由.

So you can build relative routes using them.

示例给出了路由 http://example.com/dir/one/two/three/ 和你的 calling 文档在 three/:

Examples given the route http://example.com/dir/one/two/three/ and your calling document being inside three/:

"./pictures/image.png"

或者只是

"pictures/image.png"

将尝试在 http://example.com/dir/one/two/three/ 中找到名为 pictures 的目录.

Will try to find a directory named pictures inside http://example.com/dir/one/two/three/.

"../pictures/image.png"

将尝试在 http://example.com/dir/one/two/ 中找到名为 pictures 的目录.

Will try to find a directory named pictures inside http://example.com/dir/one/two/.

"/pictures/image.png"

会尝试直接在 / 或 example.com(它们是相同的)，在同一级别上找到名为 pictures 的目录作为目录.

Will try to find a directory named pictures directly at / or example.com (which are the same), on the same level as directory.

这篇关于HTML:图像不会显示?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！