Question

我是编码新手，用html和css构建了一个简单的网站。我试图将本地计算机中的图片添加到该网站。图片文件放在与我的html和css文件相同的文件夹中。但是，当我的页面加载时，图片不会显示。为什么会这样？这是我的HTML代码。对于可能出现的问题的建议非常感谢。

<head>
<link rel="stylesheet" type="text/css" href="myStyle.css"/>
<title>My Professional Site</title>
</head>
<body>
<h1>Jon Doe</h1>
<h2>Learning to code.</h2>
<img src = "IMG_0523.jpg" alt="Sorry No Picute Available"    style="width:300px;height:300px;">
<p>"Trying to learn to code." </p>
<footer>Contact Info: jd@mail.com   555-5555</footer>
</body>
</html>

Answer 1

目录结构1

根

图像
- IMG_0523.jpg
的index.html

使用images/

访问它

<img src = "images/IMG_0523.jpg" alt="Sorry No Picute Available" style="width:300px;height:300px;">

目录结构2

根

IMG_0523.jpg
的index.html

然后直接访问

<img src = "IMG_0523.jpg" alt="Sorry No Picute Available" style="width:300px;height:300px;">

目录结构3

根

图像
- IMG_0523.jpg
页
- 的index.html

然后使用../images/

访问它

<img src = "../images/IMG_0523.jpg" alt="Sorry No Picute Available" style="width:300px;height:300px;">

使用相对路径

Answer 2

这可能是因为您拼写了错误的图片名称或放入了错误的扩展名。

Answer 3

尝试图像的绝对路径，而不是图像的相对路径。绝对路径看起来像这样。 C：\ IMAGES \ IMG_0523.jpg

无法从我的本地计算机上获取图片以显示在我的网站上

3 个答案: