首 页 网络编程
网页制作 图形图象 操作系统 冲浪宝典
软件教学 认证考试

网络安全 网络办公 行业资讯 评测对比
您当前位置:站长天空 -> 网络编程-> 移动开发教程
网站制作中网页、图片路径问题_站长心得
作者:网友供稿 点击:0
推荐
西部数码-全国虚拟主机10强!20余项虚拟主机管理功能,全国领先!第6代双线路虚拟主机,南北访问畅通无阻!可在线rar解压,自动数据恢复设置虚拟目录等.免费赠送访问统计,企业邮局.Cn域名注册10元/年,自助建站480元起,免费试用7天,满意再付款!P4主机租用799元/月.月付免压金
站内搜索
文章页数:[1] 

经常听到网友苦述自己的网页中有许多图片不能正常显示,究竟为什么不能正常显示呢?总结其原因绝大部分都是因为使用了错误路径所致。网页中的图像、动画等素材都有自己固定的存放位置,网页只是通过路径使用HTML语言来调用它们,然后把它们显示在网页中。在网页中的路径大体可分为相对路径和绝对路径,大家(尤其是初学网页设计的朋友)往往对它们不够认识,在应该使用相对路径的地方使用了绝对路径,从而导致浏览器无法在指定的位置打开指定的文件,使素材不能正常显示。

那什么是相对路径?什么是绝对路径呢?为什么使用了绝对路径有时就不能显示呢?让我们一起来认识一下它们吧。

比如C盘的My Pictures目录下有一个tp.jpg图像,那么它的路径就是c:\My pictures\tp.jpg,其实这种完整地描述文件位置的路径就是绝对路径。如网页index.htm中有一张图片tp.jpg,它们的绝对路径是:

c:\My pictures\index.htm

c:\My pictures\tp.jpg

如果你使用了绝对路径c:\My pictures\tp.jpg进行图片链接,那么在本地电脑中将一切正常,因为在c:\My pictures下的确存在tp.jpg这个图片。但你将它们上传到网站服务器上后,就不会正常了,因为服务器给你划分的存放空间可能在C盘其他目录中,也可能在D盘其他目录中,总之不会那么巧的就是c:\My pictures。那么图片路径应该如何设置呢?这里就必须使用相对路径了,所谓相对路径,顾名思义就是自己相对与目标位置。在上例中index.htm中连接的tp.jpg就可以使用My pictures\tp.jpg来定位文件,这样不论将这些文件放到哪里,只要它们的相对关系没有变,就不会出错。具体的链接方式是这样的:“..\My pictures\img.jpg”,其中使用“..\”来表示上一级目录,“..\..\”表示上上级的目录,以此类推。

我们一起来看看初学的朋友可能犯的几个路径错误:

例1

c:\mywed\wed\index.htm

c:\mywed\img\tp.jpg

在此例中,index.htm网页中有tp.jpg这个图片,因为两个文件同在Mywed目录下,所以初学者可能把图片链接写为img\tp.jpg,那么这样实际的链接就变为了C:\mywed\wed\img\tp.jpg,显然这是不正确的。正确的路径应该是相对路径..\img\tp.jpg。

例2

c:\mywed\wed\wed1\index.htm

c:\mywed\img\img1\tp.jpg

在此例中,index.htm网页中有tp.jpg这个图片,初学者可能错误的把图片链接写为..\img\img1\tp.jpg,那么这样转为绝对路径就是C:\mywed\wed\img\img1\tp.jpg了,因为在该目录下并没有此文件,所以显然这种链接是错误的。正确的应该是..\..\img\img1\tp.jpg。

例3

c:\mywed\wed\wed\index.htm

c:\mywed\wed\img\tp.jpg

在此例中,index.htm网页中有tp.jpg这个图片,初学者可能错误地把图片链接写为..\..\img\tp.jpg,那么这样转为绝对路径就是C:\mywed\img\tp.jpg了,因为在该目录下并没有此文件,所以显然这种链接是错误的。正确的应该是..\img\tp.jpg。

通过上面三个例子,我们可以看到网页与图片所在目录相同的部分都可以使用“..”进行代替。

有的读者可能会有这样的疑惑:一个网站有许多的链接,我怎么能保证它们的连接都正确,如果我调整了一下图片或网页的存储路径,那不是全乱了么?为了提高工作效率,我们推荐大家使用Dreamweaver进行网站编辑,因为它有个站点管理功能,使用该功能绝对路径可以自动地转化为相对路径,并且当你在站点中改动文件路径时,与这些文件关联的连接路径都会自动更改,实在是方便极了!


文章整理:站长天空 网址:http://www.z6688.com/
以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

文章页数:[1] 


放大字体显示 缩小字体显示 打印文章 推荐给朋友
热门文章
·ems图片格式转换(java)程序
·使用hashtable实现的购物车-ASP教程,ASP应用
·Java中数据库事务处理的实现-JSP教程,Java技巧及代码
·Oracle数据库操作类(c#)-.NET教程,C#语言
·移动短消息技术演进与业务发展浅析
·ASP生成静态网页,学习CASE的用法,以及“权限”的一种控制方法-ASP教程,组件开发
·中国电信发展移动通信的制式与频段选择
·ASP中access数据库的路径问题-ASP教程,数据库相关
·td-scdma系统移动台接入过程浅析
·JAVA与数据库连接方法(三)-JSP教程,数据库相关
最新文章
·fireworks表现vista毛玻璃朦胧效果_fireworks教程
·google adsense哪些情况会被k号_网赚技巧
·减少google adsense展示单元并不能提高收入_网赚技巧
·google adsense“允许域名”新功能很有用_网赚技巧
·于源:办南京人“淘宝”的大三学生_站长访谈
·谈谈网站策划和网站运营方面的点滴经验_站长心得
·美国网站兵败中国的10大思路性执行错误_站长心得
·付款流程中的电话确认_google推广
·google adsense的部分规则的背面_google推广
·googleadsense富翁排行榜最猛每月赚30万美元_google推广
相关主题
西部数码虚拟主机

友情链接
CNNIC 西部数码
万网 自助建站
虚拟主机 asp空间
域名注册 域名
域名申请 主页空间
论坛空间 网站空间
国际域名 虚拟空间
空间租用 DDOS防火墙
成都主机托管 四川主机托管
主机租用 服务器租用
网站目录 自助建站
虚拟主机 网址大全
软件下载
自助链接
虚拟主机资讯 特价虚拟主机
版权申明:本站文章均来自网络,如有侵权,请联系我们,我们收到后立即删除,谢谢!
关于我们:站长天空:专业提供最新的站长资讯、在线教程、虚拟主机权威评测、虚拟主机性能对比、网站制作教程,开发教程,站长工具。包括网页制作教程、冲浪宝典、编程参考、操作系统、软件教学、行业动态等。
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有。
发表评论 打印  刷新     关闭