使用background 的url 引入背景图片失效的问题
清楚相对路径和绝对路
-
/ 表示的是根目录
-
./表示的是当前目录
-
. . /表示的是上一级目录 同理. . /. . /表示的是上上级目录
那什么是相对路径和绝对路径呢?
相对路径:当图片存在工程文件文件夹images,此时的地址就是相对路径
绝对路径:图片在电脑上的存储位置就是绝对路径
我们如何解决呢 -
如果是使用 background:url(./images/pic.png);那么就会导致图片引入失败
因为我们一般开发引用的是外部样式表,使用该路径在当前目录下找不到images文件夹,那么也就找不到我们所想要引用的图片 -
如果使用 background:url(. ./images/pic/png); 就会先转到工程文件目录下,那么就能找到images文件夹,也就能找到我们想要的图片
-
有人可能会说根目录不行吗,我尝试过是不行的,这还是和css外部样式有关,做一个设想:我们在head里面直接写style可以吗,这样是可行的,但是这样代码的可读性和可维护性不高,所以我还是推荐使用相对路径. ./来引入