HTML图像标签问题答案

【问题标题】：HTML image tag problemsHTML图像标签问题
【发布时间】：2022-01-01 05:22:31
【问题描述】：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>How to make a basic website</title>
</head>
<body>
  <header>
    <hgroup>
    <h1>Trying to replicate newspage format.</h1>
    <h2>Shouldn't be hard if persistent in effort.</h2>
    </hgroup>

    <nav>
    <ul>
      <li><a href="#">Home</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Contact</a></li>
    <ul>
    </nav>

</header>

<section>

<article>
<h1>You can put news in here.</h1>
<h2>Introduction</h2>
<p>News is usually propoganda to get the commonfolk distracted with false information unless they dive deeply.</p>
</article>

<article>
<h1>This is a separate article.</h1>
<h2>Introduction</h2>
<p>Cybersecurity is a field that all legitamate companies should invest in. Unfortunately, many modern technologies tend
to focus more on the appealing side of the audience than the security of their information. Hence, multibillion-dollar
companies have been hacked by mere young people who have just started to learn programming within the past decade.</p>
<p>I am not surprised by the carelessness of these multibillion dollar companies. They have secretly been selling our (the average customer's) data
to scammers and marketing agencies for a quick buck. Some have even been caught sending information of citizens to foreign (to a country) governments.
This should be a crime and illegal, because it is breaching basic human rights. However, they are able to get away with it, since the thirst of this generation for technology never seems to quench.
Just by clicking "Accept" for the Terms and Conditions as well as the Privacy Policies, these companies are able to do illegal business and make billions of it.
It is not fair to the citizens, especially to the minors using their parents' devices without a clue of what they are getting into. Such practices should be deemed illegal
by federal law of all countries. There are many ways that companies can make quick money, and they do not have to compromise the safety of innocent people for that.
One such way is surveys. Investing in surveys on a company's own website is a way to get market research done. However, what researchers fail to realize is that the average consumer would
not care to chip in without an incentive.</p>

<img src="Finance.png" alt="Money" />
</article>
</section>
<footer>
Copyright &copy 2021-2022 By me

    <nav>
    <ul>
      <li><a href="#">Home</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Contact</a></li>
    <ul>
    </nav>

</footer>
</body>
</html>

所以基本上，几年前我已经毫无问题地学习了 html，并决定继续学习不同的编程语言，例如 C。在过去的一年里，我一直在努力进行编程，但结果很少，直到我决定重新开始网络开发作为一个更好的开始。

我的问题是，有时我的代码不起作用，根据无数的搜索和视频，以及花费大量时间调试，有时我的代码是正确的但不起作用。

几年前，我在自学期间深入学习了 html。但是，由于病毒，文件已损坏，我所有的努力都付诸东流了。所以我决定当我更高级并且有一些值得注意的东西可以发布一个站点时，我会再试一次。我觉得虽然我没有比当时好多少，但我现在应该专注于 web 开发（如果不是 C）。

这是我（现在）面临的一个例子：

让我大吃一惊的是，即使 W3C Validator 也接受了我的代码，但是浏览器（Internet Explorer、Edge、Chrome）拒绝显示我的图像（在 Windows 10 上使用记事本文本编辑器）。更具讽刺意味的是，几年前我成功地在我的（非官方）网站上展示了多张图片。

有什么我忘记了吗？我的意思是，我已经看了两个多小时的解决方法视频了。

【问题讨论】：

分享你到目前为止所做的代码？
可以提供你的代码和它的输出吗？
可能是因为“正在我的机器上工作...”尝试将图像上传到一个文件夹中，与 .index.html 相同，当您使用 github 部署您的网站时，此方法有效页面或vercel
或使用imgur之类的东西单独托管图像，然后在src中提供链接
你的图片文件 Finance.png 和你的 html 文件在同一个文件夹中吗？如果没有，则需要在img 标签中给出src 属性的文件夹路径

标签： html src

【解决方案1】：

如果您的图像文件 Finance.png 位于您的 html 文件所在文件夹的子文件夹之一中，则您需要在 src 属性中为 img 标记提供文件夹路径。如果您的图像文件位于 images 文件夹中，则将 img 标记如下： <img src="images/Finance.png" alt="Money"/>

【讨论】：

非常感谢。这很有帮助。

【解决方案2】：

一个常见问题可能是<img> 的src 中的图像路径不正确。

就像您可以将图像保存在同一目录中并使用访问一样

<img src="finance.jpeg" alt="finance"/>

也可以将图片保存在同一目录下名为images的文件夹中，然后像这样访问

<img src="images/finance.jpeg" alt="finance"/>

其次，检查文件的类型是否正确，是jpeg还是其他格式。
第三，检查<img>标签是否正确关闭，

【讨论】：

非常感谢。这很有帮助。

【解决方案3】：

您必须提供图像的完整路径，例如，

&lt;img src=/images/Finance.png/&gt;

如果您的图片在 images 文件夹中。

【讨论】：

非常感谢。