如图，通过live server插件预览是正常，蛋但是不发不到服务器，或是直接点击链接，页面跳转失败，图片加载失败
来源：3-2 VSCode安装、配置和插件
土豆60
2023-01-03 10:31:56
相关代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>陈晶的网站</title>
<link rel="stylesheet" href="css/home.css">
<link rel="stylesheet" href="css/ty.css">
</head>
<body>
<div class="nav">
<div class="logo">
<a href="/index.html"><img src="/images/logo.png" alt=""></a>
</div>
<div class="rignt">
<ul>
<li>
<div class="li li_g">
<a href="/about.html">关于</a>
</div>
</li>
<li>
<div class="li li_z">作品</div>
</li>
</ul>
</div>
</div>
<div class="header">
<h1>标题文本内容</h1>
<h3>副标题</h3>
</div>
<div class="main">
<div onclick="window.open('/one.html','_self')" class="item item1">
<a href="/one.html">
<img src="/images/1.png" alt="">
</a>
</div>
<div class="item item2">
<a href="/one.html">
<img src="/images/1.png" alt="">
</a>
</div>
<div class="item item3">
<a href="/one.html">
<img src="/images/1.png" alt="">
</a>
</div>
<div class="item item4">
<a href="/one.html">
<img src="/images/1.png" alt="">
</a>
</div>
<div class="item item5">
<a href="/one.html">
<img src="/images/1.png" alt="">
</a>
</div>
<div class="item item6">
<a href="/one.html">
<img src="/images/1.png" alt="">
</a>
</div>
<div class="item item6">
<a href="/one.html">
<img src="/images/1.png" alt="">
</a>
</div>
</div>
<div class="footer">
</div>
</body>
</html>完整代码下载地址
https://share.weiyun.com/aAkcabOE
写回答
1回答
-
同学你好，不清楚同学服务器具体是怎么搭建的，因为代码中a标签的href属性和img的src属性，引入的文件地址都是以/开头的，相当于是使用了绝对路径，所以，不使用Live Server，直接打开是无法加载图片的。
可以从如下角度排查问题：
1、查看服务器的文件夹位置，以当前index.html文件所在的文件夹作为服务器的根目录。
2、调整为相对路径，即：将 / 换成 ./ 试试。
祝学习愉快~
0
相似问题