老师为什么图片404了呀

来源:3-4 自由编程

hyperse

2020-10-13 04:00:12

这是目录:http://img.mukewang.com/climg/5f84b54a0970ed1b01680244.jpg


这是scss文件:

http://img.mukewang.com/climg/5f84b5640917c42006700371.jpg



编译后的css文件:

http://img.mukewang.com/climg/5f84b57609b4393f07600179.jpg



index.html

http://img.mukewang.com/climg/5f84b58c0978eb8007880523.jpg



图片就是下载的辅助资料,直接拖到img文件夹里面,是不是我的路径写错了呀?

还有就是hbuilderx里面如何每次自动编译sass?要不然保存一次就要重新右键编译,好麻烦

写回答

2回答

好帮手慕慕子

2020-10-14

同学你好,对于你的问题解答如下:

  1. 绝对路径:绝对路径就是文件电脑硬盘上的路径。

    如下图所示,在桌面的test文件夹下有一张图片,从硬盘开始查找图片,即:C:\Users\Administrator\Desktop\test\1.png 代表了图片的的绝对路径。

    http://img.mukewang.com/climg/5f8657b109c99f9603450164.jpg

    html中使用如下:

    http://img.mukewang.com/climg/5f86583109cdb0be09340111.jpg

  2. 相对路径:相对与某个基准目录的路径。"./"代表当前目录"../"代表上级目录,老师举了一个简单的例子,同学可以参考理解下

    示例:有一个project文件夹。里面的所有文件如下所示

    http://img.mukewang.com/climg/5f8658bf097a1a7803000269.jpg

    在html中引入图片,以html文件为基准查找,由于img文件夹与html文件是同级的,所以使用./找到img文件夹,然后再找到img文件夹下1.png图片

    http://img.mukewang.com/climg/5f865924098038a012370105.jpg

    在css中引入图片,以css文件为基准查找, 由于img文件夹与css文件的上一级css文件夹同级,所以需要选找到上一级css文件夹所在的位置,然后再查找img文件夹下的图片。

    http://img.mukewang.com/climg/5f8659fb099ea6be05620122.jpg

祝学习愉快~

0

好帮手慕慕子

2020-10-13

同学你好, 看截图代码书写是没有问题的,图片引入的路径也是正确的,建议同学清除浏览器缓存在测试下。

如果还是不可以,可以详细描述下具体是在哪个浏览下测试的,图文结合描述下,便于帮助同学准确的定位与解决问题

保存时,自动编译sass文件,在同学的另一个提问下已经做出了解答,同学可以查看测试下

https://class.imooc.com/course/qadetail/259356 

祝学习愉快~

0
hyperse
h 老师可以顺便讲一下路径怎么写吗,比如绝对路径和相对路径,还有../之类的,我有点模糊,谢谢!
h020-10-13
共1条回复

0 学习 · 10739 问题

查看课程