路径在html中的作用主要是进行外部资源的引入,如css文件,js文件,媒体文件等。

  而路径本身有分为相对路径和绝对路径。所谓相对路径,就是相对于链接页面而言的另一个页面的路径。而绝对路径,就是直接从 file:///磁盘符开始的完整路径。(注意,盘符主要是针对windows)。


1.绝对路径

<a href="file:///D:/HTML5/code/index2.html">index2</a>

解释:首先是 file:///开头,然后是磁盘符,然后是一个个的目录层次,找到相应文 件。这种方式最致命的问题是,当整个目录转移到另外的盘符或其他电脑时,目录结构一旦 出现任何变化,链接当即失效。


2.相对路径

<a href="index2.html">index2</a>

解释:相对路径的条件是必须文件都在一个磁盘或目录下,如果是在同一个目录下,直 接属性值就是被链接的文件名.后缀名。如果在同一个主目录下,有多个子目录层次,那就 需要使用目录结构语法.


3.目录语法

同一个目录:index2.html 或./index2.html;

在子目录:xxx/index2.html;

在孙子目录:xxx/xxx/index2.html;

在父目录:../index2.html;

在爷爷目录:../../index2.html;


最后,一个要注意的地方是:不管你有没有发现,其实windows和linux系统的路径分隔符是不一样的,windows为 \ ,而linux为 / 。但不管最终运行在什么平台,路径的表示都要使用linux的习惯,也就是 / 。

5.html5中的路径表示的更多相关文章

  1. HTML5 中的 canvas 画布(一)

    ---恢复内容开始--- 在HTML5中新添加的元素,canvas 现在支持 IE9+的版本 注意:HTML5 <canvas> 元素用于图形的绘制,通过脚本 (通常是JavaScript ...

  2. 【javascript】html5中使用canvas编写头像上传截取功能

    [javascript]html5中使用canvas编写头像上传截取功能 本人对canvas很是喜欢,于是想仿照新浪微博头像上传功能(前端使用canvas) 本程序目前在谷歌浏览器和火狐浏览器测试可用 ...

  3. 使用HTML5中postMessage实现Ajax中的POST跨域问题

    HTML5中提供了在网页文档之间相互接收与发送信息的功能.使用这个功能,只要获取到网页所在窗口对象的实例,不仅仅同源(域+端口号)的web网页之间可以互相通信,甚至可以实现跨域通信. 浏览器支持程度: ...

  4. html5中的video标签和audio标签

    不管是否承认,flash早已不像过往那样如日中天了.亚马逊全面放弃flash.苹果放弃flash.安卓也放弃了移动端的flash支持.事实上flash已经不太适合web开发了,因为HTML5中的vid ...

  5. session与cookie的区别以及HTML5中WebStorage理解

    一.session与cookie的区别 二.HTML5中WebStorage理解 WebStorage的目的是克服由cookie所带来的一些限制,当数据需要被严格控制在客户端时,不需要持续的将数据发回 ...

  6. 解决html5中video标签无法播放mp4问题的办法

    这篇文章主要给大家介绍了关于解决html5中video标签无法播放mp4问题的办法,文中介绍的非常详细,相信会对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起看看吧. 最近发现了一个 ...

  7. 使用HTML5中postMessage 实现ajax中的POST跨域问题

    HTML5中提供了在网页文档之间相互接收与发送信息的功能.使用这个功能,只要获取到网页所在窗口对象的实例,不仅仅同源(域+端口号)的web网页之间可以互相通信,甚至可以实现跨域通信. 浏览器支持程度: ...

  8. HTML5中本地储存概念是什么,什么优点 ,与cookie有什么区别?

    html5中的Web Storage 包括了两种存储方式: sessionStorage  和  localStorage. seessionStorage 用于本地存储一个会话(session)中的 ...

  9. HTML5中video标签与canvas绘图的使用

    video标签的使用 video标签定义视频, 它是html5中的新标签, 它的属性如下(参考自文档): domo01 <!DOCTYPE html> <html lang=&quo ...

随机推荐

  1. 在 Visual Studio 2013 中使用 Grunt, Bower 和 NPM

    在 Visual Studio 2015 中提供了对于 Grunt 和 Gulp 的内置支持,在 Visual Studio 2013 中怎么办呢?微软将 2015 中的特性作为几个独立的扩展发布出来 ...

  2. 下载和使用 Open XML PowerTools

    安装 Open XML SDK 2.5 首先,需要安装 Open XML SDK 2.5 ,从这个地址下载安装程序:http://www.microsoft.com/en-in/download/de ...

  3. Bootstrap 3 How-To #1 下载与配置

    Bootstrap 3 发布了,通过简单的几步,我们就可以使用 Bootstrap 的样式表,图标,以及 javascript 来配置一个简单的站点. 准备 Bootstrap 不仅仅是一个代码集,还 ...

  4. 剑指Offer:面试题6——重建二叉树(java实现)

    问题描述:输入某二叉树的前序遍历和中序遍历的结果,请重建出该二叉树.假设输入的前序遍历和中序遍历的结果中都不包含重复的数字. 例如: 输入:前序{1,2,4,7,3,5,6,8},中序{4,7,2,1 ...

  5. HIVE配置文件

    进入HIVE_HOME/conf 编辑文件hive-site.xml,内容如下:(这是伪分布式模式) 主要声明了以下几个内容: 数据仓库地址 数据库连接地址 数据库连接驱动 数据库连接用户名 数据库连 ...

  6. android 数据存储----文件方式 总结

    在android中的文件放在不同位置,它们的读取方式也有一些不同. 本文对android中对资源文件的读取.数据区文件的读取.SD卡文件的读取及RandomAccessFile的方式和方法进行了整理. ...

  7. android项目中如何加载已有so库 <转>

    1,在项目根目录下建立文件夹libs/armeabi文件夹 2,将so库放入 libs/armeabi文件夹 注意事项: 1,如果采用静态注册的方式请注意C文件中严格按照命名规则 Java_packa ...

  8. tomcat, jdk, eclipse, ant的安装,设置及常见问题

    1.tomcat 安装: 安装版:在官方下载tomcat的安装版,根据提示一步步操作,很简单的 解压版:在官方下载tomcat的解压版,放到要安装的目录中解压版即可 同以前的找到设置环境变量的地方. ...

  9. 洛谷P1467 循环数 Runaround Numbers

    P1467 循环数 Runaround Numbers 89通过 233提交 题目提供者该用户不存在 标签USACO 难度普及/提高- 提交  讨论  题解 最新讨论 暂时没有讨论 题目描述 循环数是 ...

  10. 洛谷P1113 杂物

    P1113 杂务 251通过 441提交 题目提供者该用户不存在 标签图论递推 难度普及/提高- 提交该题 讨论 题解 记录 最新讨论 为什么会只有10分? 题目描述 John的农场在给奶牛挤奶前有很 ...