在牛腩新闻发布系统中,制造可变宽度的圆角框一集中,我们是从中引用了母版页,但这时运行出来的网页中的图片并不能正常显示。根据视频讲的我们可以知道,我们需要修改母版页中的图片路径,那么,问题来了:路径修改后仍然是存在问题的。
先看一下在没有修改路径前,网页是这个样子的:
可以看出两张图片都不能正常地显示出来,视频中也说了,这种情况是正常的,我们需要修改母版页中图片的路径,根据提示,我对图片的路径进行了修改,对图片添加了上一级目录,如下:
<div id="top">
<a href="Default.aspx">
<img src="/web(1)/images/niunanlogo.jpg" /></a>
<a href="http://www.tg029.com" target="_blank">
<img src="/web(1)/images/tg029logo.gif" /></a>
</div>
这样一来,不但效果没出来不说,连原来没有问题的网页也出了问题,所有的网页图片全都变成了上图所示的样子。把我的小牛给藏起来了。通过寻求帮助,问题最终还是解决了,如下:
<div id="top">
<a href="Default.aspx">
<img src="../images/niunanlogo.jpg" /></a>
<a href="http://www.tg029.com" target="_blank">
<img src="../images/tg029logo.gif" /></a>
</div>
看出来了吗?只是把图片路径中在最原来的基础上添加了“../”,这样我们的网页图片就成功显示出来了,还是很有效果:
有了这个问题,又为什么会这样呢?这就涉及到了我们之前也总提到的相对路径和绝对路径的问题。
路径问题
绝对路径
绝对路径就是你的主页上的文件或目录在硬盘上真正的路径。绝对路径一般在CGI程序的路径配置中经常用到,二在制作网页中实际很少用到。所以在我们的系统中,我们就要避免使用绝对路径。
相对路径
相对路径就是相对于当前文件的路径。网页中一般表示路径使用这个方法。
来看几种常用的相对路径表示方法:
“.”代表目前所在的目录;
“../”表示源文件所在目录的上一级目录;
“../../”表示源文件所在目录的上上级的目录,以此类推;
引用下级目录的文件,直接写下级目录文件的路径即可。
在使用的过程中,我们还是会遇到各种各样的问题,总结的很片面,但这是对我这段学习遇到的问题的自我认为很好的记录方法,也可以进一步帮助我扩展知识面。将前后学到的知识汇总之后,我们会收获一个巨大的宝库。