HTML5图像不会显示_Html - Fatal编程技术网

HTML5图像不会显示

html

HTML5图像不会显示,html,Html,我使用记事本++作为初学者。我在文档中创建了一个父文件夹，保存代码，在该文件夹中创建了一个子文件夹来存储图像下面是我使用的代码 <section> <img src="img/vietnam.jpg" </section> 为什么不显示？我已将子文件夹中的图像命名为Vietname.jpg:S您缺少img标记的右括号，这将导致无法正确显示的无效html 看看这个例子这里的问题可能是因为您没有找到图像所在的正确路径。例如，如果您的html文件包

我使用记事本++作为初学者。我在文档中创建了一个父文件夹，保存代码，在该文件夹中创建了一个子文件夹来存储图像

下面是我使用的代码

 <section>
     <img src="img/vietnam.jpg"
</section>

为什么不显示？我已将子文件夹中的图像命名为Vietname.jpg:S

您缺少img标记的右括号，这将导致无法正确显示的无效html

看看这个例子

这里的问题可能是因为您没有找到图像所在的正确路径。例如，如果您的html文件包含在与img文件夹处于同一级别的文件夹中，那么您应该添加

。/

，以达到一个级别，然后指定要进入的文件夹，在本例中为

img

文件夹

例：


/=根目录
.   = 这个位置
..  = 查找目录
./=当前目录
../=当前目录的父目录
../../=向后两个目录

如果您的HTML源文件（例如index.HTML）位于文件夹c:\Users\Patricia\Documents\adv中，那么由于您的img文件夹是\adv的子文件夹，以下操作应该有效

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <section>
      <img src="img/vietnam.jpg" alt="vietnam">
    </section>
  </body>
</html>

HTML源父文件夹的路径是什么？

首先，我建议您切换代码编辑器（例如，切换到VisualStudio代码，因为它是业界广泛使用/首选的编辑器之一。当然还有其他编辑器/IDE，如WebStorm等）。基本上，有了正确的插件/配置，你将快速成为超级英雄。例如，请看下面的屏幕。我在VisualStudio中使用了相对路径，它显示了您当前所在的当前路径。

Add>after.jpg“关闭图像标记。您的代码到底是如何运行的？冒着听起来很傻的风险，我正在将其保存在父文件夹中，然后单击它从文档文件夹中进行测试，是否有更有效的方法？谢谢John，我尝试过，但没有成功。”。我在下面复制了我的全部代码，直到我尝试添加图像为止，这一切都很好，我只是不明白我在这里做错了什么。使用绝对路径

/img/Vietname.jpg

而不是

img/Vietname.jpg

我尝试了一切，这就是我想要使用的图像的地方，我尝试了上面的所有内容，但仍然一无所获：（C:\Users\Patricia\Documents\adv\imgThanks Dan，我以前使用过绝对路径技术，现在它已经开始运行了！：）这看起来容易多了，但我不允许使用它；这是一个大学作业！：S谢谢你的建议，我一定会检查它的。

<section>
  <img src="../img/vietnam.jpg" alt="vietnam">
</section>

    /   = Root directory
    .   = This location
    ..  = Up a directory
    ./  = Current directory
    ../ = Parent of current directory
   ../../ = Two directories backwards

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <section>
      <img src="img/vietnam.jpg" alt="vietnam">
    </section>
  </body>
</html>