开发者学堂课程【零基础学前端 HTML+CSS：路径概念 】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/398/detail/5112
路径概念
内容介绍：
一、路径
二、举例
一、路径
我们发现在之前写图像时，有 src= “images/Koala.jpg”，其中 Koala.jpg 是图像文件名，images 是一个目录名，接下来引出路径的概念。如果路径不对，那么我们访问的内容就无法出现。
路径
路径分绝对目录和相对目录
用网络形式来划分还可以分网络目录和硬盘物理路径
我们普通网站在做链接都是相对的网络路径。
同级别，直接写文件名。
上级别，用../文件名
下级别，用目录名/文件名
二、举例
在系统保留 ( Y: )盘中，新建文件夹 web，在 web 中建 images 文件夹和 index.html 的文本文档。这两个就属于相对的概念。
拷贝企鹅图像放入文件夹中，然后打开 Webstorm 新建一个 images.html 存入 Y 盘 web 中，输入
<img src= “images/Penguins.jpg”>
运行后出现企鹅图片
这时我们的路径属于下级别，如果我们改变图片的名字或者路径都会显示不出。
比如将图片放入 web 文件夹下，与 images 文件夹同级，则会
此时同级别直接写文件名，修改
<img src= “Penguins.jpg”>
正常显示图片
如果在上级别，将图像剪切到 web 同级，即图像在 images 文件夹上一级别
修改
<img src= “../Penguins.jpg”>
类似上两级则为<img src= “../../Penguins.jpg”>
以上就是相对的路径，那什么是绝对路径呢？比如说将一张灯塔图像直接拷到 c 盘下，则输入
<img src= “c:\Lighthouse.jpg”>
写入 c 盘下，图像可以显示出来，但是发布到互联网上，用户的 c 盘下没有此图像，所以用户在查看源代码时 <img src= “c:\Lighthouse.jpg”>会报错，所以我们所做的站点包含的链接都不能出现硬盘的路径.
<html>
<head lang=’’en’’
<meat charset=UTF-8
<title></title>
<head>
<body>
<img src= “c:\Lighthouse.jpg”>
<body>
<html>
网络绝对路径：
现在要链接魔乐科技的 logo，
logo 路径为 www.mldn.cn/files/system/logo_1422951708.gif ，但是又不希望把 logo 另存为我们的服务器上去，如果想写网络相对路径的话，我们需要把这张图片另存为目录里才可以，比如存到系统保留 (Y:)>web>images 下才能做相对路径。
但是如果不想存或者想引用，这时就要写一个网络绝对路径
<imgsrc= “http://www.mldn.cn/files/system/logo_1422951708.gif”>
运行后出现 logo
总结：
路径分为网络路径和硬盘物理路径，我们在网上使用的都是网络路径，网络路径又分为相对路径和绝对路径，大部分情况使用的是相对的网络路径。
同级别的是直接写文件名，上一级别写../文件名，下一级别写目录名/文件名
