12.尚硅谷_HTML&CSS基础_相对路径.avi原创

那我们还是说一下这个图片的问题，那这里边儿呢，我来，呃，DEMO里边我把这个hello，下边呢，我复制一个ctrl c ctrl v DEMO呢，这是一个零。明白，然后把它拖过来，那这里边我们主要说的是一个我们图片的一个这个路径的问题，那这里边我们引入一个图片，我这是一个引入一个1.bf这个大小的宽高，我就先不给它设置了，保存一下我这里边儿。Hello，这些没用的，我先都给它关上啊，干扰到。诶，Hello，打开我这个零八点名这个图片我们是不是引入进来了呀？诶那图片引入进来，我们说了引入哪个图片，我们是通过这个src属性来控制的吧，哎，我如果写的是2.gf引入的就是我们这个。那个那个大嘴是吧，哪个大嘴你写哪个就引入哪个，那我们说了这个东西我们叫什么呀？叫做图片的什么呀？路径啊路径，我们说src属性，Src属性配置的是我们这个图片的什么玩意儿，图片的路径，诶那我们说诶目前我们所要什么呀？诶所要使用的这个路径全都是什么呢？全都是相对路径啊，全都是这个相对路径，那什么叫做相对路径呢？那么说相对路径指的什么呢？我们说相对路径指叫相对于叫什么呢？当前资源所在，哎，目录的这个什么呀，目录的这个位置啊，相对于当前资源，诶相对。

与相对路径只相对于当前资源所在目录的什么呀位置？诶，那我们先来看第一个问题，什么叫当前资源？什么叫当前资源？说白了，我这路径写在哪，谁就是什么呀，当前资源，那你看我这2.gif，这个路径写哪了？是不是写到这个DEMO。

零八这个点哪里边了，诶写到这个页面里，那我们说这个路径相对于谁呢？相对于DEMO08所在的目录来说的，那我们来看DEMO08跟哪儿呢？DEMO08跟哪呢？是在hello这个文件夹下呢，诶hello这个文件夹下呢，那那也就是说我这个相对路径是相对于谁呀，是不是相对于hello啊，哎，Hello，所以我这写一个2.gif什么意思，去hello里边去找2.gif有没有。有吧，诶，所以干嘛呀，就能找到啊，所以就能找到，那现在我们来说一个我W08CTRLX剪切放到hello里边了。那我问你这回这图片还有没有了？哎，那这回相对于谁了？是不是相对于DEMO了？哎，那DEMO下边有2GF吗？没有，所以你就刷新走你。

诶，完了，这路径这文件是不是都没了呀，我们还得重新打开一下，一打开是不是这是一个大松鼠啊，诶图片就没了啊，所以注意我们相对路径是相对于当前资源，所有路径咱们给它拖回去，注意刷新，现在能有啊，现在有然后干嘛呢？我再干一件事啊，来，我在hello里边创建一个文件夹，等于什么呢？ABC，然后把2.gif放到什么呀，ABC里，那现在问你图片有没有了，诶我们现在路径没变，是不是还是去我们这什么呀，当前目录下去找2.gf吧，当前目录是hello hello，下边有2GF吗？没有，所以你这一刷新走，你是不是就没了呀？哎，没了，那我得怎么改呀。我怎么改，我是不是得找ABC下边的。2.gf，诶所以怎么写呀，诶ABC斜杠啊，2.gf，这回一保存再来刷新走，你是不是就有了呀，哎就有了，那现在再来看ABC里面还有一层，还有什么呢？新建一个，我们来什么呢？来一个BCD，把图片放BCD里。

这怎么写，哎，我是不是ABC后边再加一个这个BCD啊，一保存这样才对啊，所以这个路径啊，你要搞清楚，叫做一个相对路径啊，相对路径，但是这个还好理解，那现在我再换一个，换一个什么呢？这个呢，我先给它注掉。放这注意一个啊，然后呢，这里边我不这么写了，我这里边儿呢，我来把这个2.gf啊CTRLX给它放哪呢。放hello，下边还放回hello，放hello怎么改？是吧，ABC和BCD都给它去了呀，去了一保存一刷新是不是还有啊，诶来看这我把它干嘛呢？CTRLX放到这个，也就是说我是不是放到这个hello的上一层目录DEMO里了，那现在问你，我现在能找着吗。

我一刷新是不是没了呀？诶我们来看我这么写什么意思，这么写表示去DEMO08所在的目录下去找2.gif对吧？那W08所在的目录是什么呀？是hello吧？那hello里边有2DM吗？没有，所以他是找不着啊，那不说了，那在哪呢？他是不是在它上一层DEMO里呢？诶那我一说我直接来个什么呀，DEMO斜盖2.gf行不行，那这表什么意思？我去hello下的DEMO下边去找2.df吧，那哈，下边有DEMO吗？没有是不是也找不着啊？那我得干嘛呀？我要想找到2.gif，我是不是先得从hello出去呀？那我得干嘛呀？我是不是得从hello返回到我们这个DEMO文件夹，然后再找2.bf诶，那我们怎么返回一级呢？

哎，我们来说一下，我们可以什么呢？可以使用我们这个点点斜盖来干嘛呢？来返回一节目录，那现在干嘛呢？我想返回到DEMO里边，我怎么写呢？直接来一个点点斜杠，这个代表什么呢？代表返回当前文件夹的什么呀？上一级当前文件夹是谁呀？是不是hello啊hello，上一级是不是就DEMO啊，那问题来了，DEMO里边有没有2.gf，有所以我直接干嘛呀，斜杠后边二点。GIF是不是行了，来我这一保存，咱们再看一刷新是不是又出来了，哎，又出来了啊好，那再看啊，再看一步步来来我这新建一个文件夹，叫做一个MG，我在DEMO下装创建了一个MD，然后呢2.gf放到什么呀。I'm really。现在还找着吗？是又找不着了怎么办？

我是不是这再加一个MG啊，哎，DEMO下的MG下的什么呀？2.gf啊，保存我这一刷新走，你是不是又出来了，哎，出来啊，所以这路径一定要整清楚，嘿，那又有问题了，哎，咱们又找事啊找事来咱们把这玩意儿干嘛呀？图片，Ctrl X DEMO上一集是谁啊？这是什么呀？是我桌面啊，来CTRLV干嘛了？我是不是把这个IG放到桌面上来了，哎，那现在有没有了，没有了，哎没有了那怎么办呀，桌面是DEMO的上一级吧，所以我返回DEMO返回一级，我还在干嘛呀，是不是再返回一级啊，那怎么再返回一级啊，哎点哎我是不是再写一个点点斜杠啊，所以这边我们来说叫什么呢？返回几级目录，哎返回几节目录就写几个哎点点斜杠我返我写两个点点斜点是不是表示返回两级啊，那我从后我从这个hello里边返回一级到哪儿啊？DEMODEMO再返回集到哪啊。

到我们桌面，所以这个叫什么呀，返回到桌面，我们来看效果一刷新走或者没保存吧，诶注意啊，随手摁一下保存，这边红色表示你没存啊，CTRLS快捷键啊快捷键保存一刷新走，你是不是出来了，哎，出来了啊，所以注意使用几个点点鞋面就返回几个目录啊来，那这个呢，我先给它放上边这路径啊，可能会第一次接触的话会稍微有点绕，所以你们回去好好的去捋捋啊，捋捋好，然后我把这个路径呢还给它，我还给他放回到这个弹幕里啊，不往外放了，好那这就是我们说的路径问题，诶那之前还有会同学有有同学问什么呢？诶问老师啊，那我这图片我是这么放的，这图片干嘛呢？CTRLC。

我现在是不是在桌面，是不是在C盘呀，哎，我直接放在哪了呀，放到E盘里边了，诶放到E盘里边了，那行不行啊也行啊也行，但是我们说现实情况有没有这个需求啊，没有这个需求，我们一般开发的网站是干嘛的呀，都是部署到我们的，有这个服务器里的啊，我们服务器我会不会说我这个一个网站，我把网页部署到一个服务器，把图片再部署到一个服务器啊，一般都是什么呀，一般都是部署到同一个服务器里的，所以我没有这种需求，说把一个放到C盘，一个放到一盘，我怎么去找，没有这个需求，一般都是什么呀，都是在一起的，而且干嘛呀，你这个文件尽量不要离的干嘛呀，太远，离远了你写的时候是麻烦呀，你改的时候也麻烦，所以尽量不要离得太远了，那同学说了，老师我就我这需求，我就想引入一个其他网站的图片的一个路径，那怎么办？哎，那那个时候我们我们就得使用什么呀，绝对路径了啊，就得用绝对路径了，所以相对路径一般都是什么呀，不会去找太远的，不会说一个在C盘，一个在D盘，我从C盘去找D盘，那样就得写什么了，绝对路径，但是现在我们不涉及到这个问题，所以这个问题我们不用去考虑啊，不用去考虑好那这个呢，是我们这个相对路径，我们来说到这儿停一下。