图片的src问题

图片的src问题

http://img1.sycdn.imooc.com//climg/609dd23e097f2dc912720909.jpg


我的文件夹是这样的

http://img1.sycdn.imooc.com//climg/609dd268098e574608900359.jpg

http://img1.sycdn.imooc.com//climg/609dd28009047d0608930311.jpg


问题1:为什么我把开头的斜杠去掉,网页就可以正常显示图片?

http://img1.sycdn.imooc.com//climg/609dd2c409dd898316990550.jpg

http://img1.sycdn.imooc.com//climg/609dd32c09128fc615390487.jpg


问题2:

http://img1.sycdn.imooc.com//climg/609dd39d0919e83608140762.jpg

正在回答

登陆购买课程后可参与讨论,去登陆

2回答

同学你好,关于同学的疑问解答如下:

1、关于路径问题:

“./”:代表当前所在的目录,以当前目录为起点查找所需的资源

”/”:代表根目录,以根目录为起点查找所需的资源,有点类似于绝对路径的写法,不建议使用“/”,因为不利于项目的迁移(例如:在老师的代码中路径使用“/”是可以的,但是在同学的代码中使用“/”就不对了,需要修改成“./”才可以)

以下图为例:在index.html中引入img文件夹中的1.jpg,路径写法如下

http://img1.sycdn.imooc.com//climg/609de338095a40a502920154.jpg

http://img1.sycdn.imooc.com//climg/609e2b7a0934985106800304.jpg

2、关于路径自动提示问题:因为”/”代表的是根目录,所以会从根目录开始提示。

祝学习愉快!

  • 慕仙2169824 提问者 #1

    根目录是如何界定的?在根目录之前还有很多层文件夹,为什么之前的这些文件夹都不是根目录?

    2021-05-14 10:47:12
  • 慕仙2169824 提问者 #2

    你说的 './' 里面有一个点,和这个上课时说的‘../’两个点有什么区别?http://img1.sycdn.imooc.com//climg/609de71709d65a6e06900367.jpg

    2021-05-14 10:58:31
  • 好帮手慕然然 回复 提问者 慕仙2169824 #3

    同学你好,“./”和‘../’是相对路径的两种写法:

    其中'./'表示当前目录,即从当前目录出发查找资源,一般可省略不写,例如

    http://img1.sycdn.imooc.com//climg/609e071d09437c7d09810247.jpg

    '../'表示上一级目录,即从当前目录出发,查找上一级目录下的资源,例如

    http://img1.sycdn.imooc.com//climg/609e074609eda81810220240.jpg

    如果两个“../../”表示上一级目录的上一级目录(以此类推),例如

    http://img1.sycdn.imooc.com//climg/609e0761093e4cf812630266.jpg

    祝学习愉快!

    2021-05-14 13:19:34
好学手慕白白 2021-05-14 10:12:07

同学您好,因为这是相对路径,由于你的文件夹结构和老师的不一样,视频讲师所加的/(斜杠)是根目录,代表此项目文件的最高层级文件夹(既在VScode中打开的最高层级文件夹),老师的相对路径含义是项目文件夹(相当于同学在VScode中打开的项目文件夹最顶部的文件夹)下的images文件夹(我推测同学在VScode中打开的项目文件夹是"阶段一:前端基础入门",如果你在这个文件夹下创建一个"images"文件夹按照老师书写就没问题了)第二种方式是同学直接在VScode中打开项目文件"第七周DOM6-2"再按照老师书写也同样没问题,祝学习愉快!ε≡٩(๑>₃<)۶ 一心向学

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星

相似问题

登录后可查看更多问答,登录/注册

请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师