非凡资讯

网页设计培训资讯>上海静态网页设计培训老师介绍html代码中绝对路径和相对路径区别

上海静态网页设计培训老师介绍html代码中绝对路径和相对路径区别
发布日期:2018/11/22 15:15:56    上海静态网页设计培训机构 1117 分享
刚开始学习DIV/CSS的学员们通常分不清html代码中的绝对路径和相对路径,下面上海静态网页设计培训老师就来介绍下html代码中绝对路径和相对路径的基本知识、作用、用法等知识。
上海静态网页设计培训

一、绝对路径和相对路径是什么?  
 
相对路径:以引用文件之网页所在位置为参考基础,而建立出的目录路径。因此,当保存于不同目录的网页引用同一个文件时,所使用的路径将不相同,故称之为相对。
 
绝对路径:以Web 站点根目录为参考基础的目录路径。之所以称为绝对,意指当所有网页引用同一个文件时,所使用的路径都是一样的。
 
其实绝对路径与相对路径的不同处,只在于描述目录路径时,所采用的参考点不同。由于对网站上所有文件而言,根目录这个参考点对所有文件都是一样的,因此,运用以根目录为参考点的路径描述方式才会被称之为绝对路径。
 
二、路径特殊符号
 
以下为建立路径所使用的几个特殊符号,及其所代表的意义。
 
"." -- 代表目前所在的目录,相对路径。 
".." -- 代表上一层目录,相对路径。
"../../" -- 代表的是上一层目录的上一层目录,相对路径。 
"/" -- 代表根目录,绝对路径。 
"D:/abc/" -- 代表根目录,绝对路径。
 
上海静态网页设计培训老师提醒,在使用相对路径时,我们用符号“.”来表示当前目录,用符号“..”来表示当前目录的父目录。
 
三、通俗讲解路径

绝对路径顾名思义,填写绝对目录路径地址那就叫绝对路径,通常我们直接使用"/"代表从根目录开始的目录路径,这个叫绝对路径。
相对路径顾名思义,填写目录时候以填写目录文件为参考,使用“../”或"./"指向上一级 或 使用"../../"指向上上一级叫相对路径。
 
引用者       被引用者                    相对路径                                                    绝对路径
 
url1.htm     divcss5.gif                ../SubDir2/BeRef1.gif                            /Dir1/SubDir2/BeRef1.gif
 
url2.htm     divcss5.gif              ../../Dir1/SubDir2/ BeRef1.gif                  /Dir1/SubDir2/ BeRef1.gif
 
url3.htm     abc1.htm                ../../Dir2/ abc1.htm                                 /Dir2/abc1.htm
 
url4.htm     abc2.htm                 ../abc2.htm                                            /Dir2/abc2.htm
 
说明:我们使用“/”、“../”、“../../”分别样式和介绍图片路径和网址路径之间 相对于绝对路径关系。
 
四、绝对路径和相对路径的作用是什么?
 
相对路径和绝对路径都可相互转换,转换时候注意正确路径即可,作用在于有效链接路径。
 
相对路径与绝对路径与CSS关系?
1、我们在CSS中引入图片地址的时候就可能用到相对路径与绝对路径
2、我们在DIV+CSS的html中在HTML引入CSS文件、引入添加图片的时候 就会用到相对路径与绝对路径

本文来源:网络。整理:上海静态网页设计培训老师。更多资讯【请关注微信号:feifanxueyuan】(版权声明:推送文章和图片我们都会注明作者和来源,除非确实无法确认。部分文章和图片推送时未能与原作者取得联系,若涉及版权,烦请原作者联系小编更正,谢谢。)
相关文章:
上海静态网页设计培训老师介绍html代码中绝对路径和相对路径区别
免费试听热门课程
在线客服
免费试听
最新活动
学费查询
开班查询
就业薪资