牛腩新闻发布--页内图片不显示

左手的ㄟ右手 2021-09-26 19:52 348阅读 0赞

## 出现问题 ##

当我在敲击牛腩Web的时候，使用Web母版页建立categorymanager模块，同时引用了m\_common母版页，引用之后我使用Ctrl+F5运行，发现图片加载不出来，如下所示：  
![图片加载不出][70]  
我就感觉很纳闷，为什么会这样，于是我再从新运行其他的有图片的页面，发现登录窗体页面的图片也加载不出来了，如下：  
![登录窗体页面图片加载不出来][70 1]

## 解决思路 ##

这是为什么呢？对于刚学HTML5和CSS3的我来说，这很让我懵逼啊！因为没有遇到过，怎么办？于是在网页中点击F12，看了半天，如下：  
![这里写图片描述][70 2]  
为什么呢？百度了一下然后没出什么结果，自己又回来弄呗！  
![这里写图片描述][70 3]  
右击图片链接，点击属性，看看里面能有什么解决方法没，然后看到了百度上所说了图片所在地址，但是看到这个地址对于没有这方面经历的人来说，有和没有是一回事，因为不会如何操作。所以接下来就是我个人花了一晚上的时间解决这种问题的方法，希望对大家有帮助。

## 解决方法 ##

首先确定一下，如果你这个模版是引用了其他模版，那么去图片所在的模版找到图片所在的位置，比如我这个categorymanager模块首先引用了m\_common母版页，m\_common母版页又引用了manager\_common样式表，同时还套用了另一个母版页common，于是就去manager\_common样式表以及common母版页中去找图片，最后在common母版页中找到了图片的位置，看到图片是链接是这样的：  
![这里写图片描述][70 4]  
然后这里面出现的是相对路径，所谓相对路径是相对该页所在位置，列出到达目标的路径。所以此时，需要这里的地址改为绝对路径，即目标的详细地址。  
此时我应当着这图片的地址改为图片的绝对路径，于是我将两张图片的地址都改为其绝对路径，如下：  
![这里写图片描述][70 5]  
这是，图片就成功加载出来了，如下：  
![这里写图片描述][70 6]

## 总结 ##

问题使我们前进的基石，我们需要不断的遇到问题，并且去解决消灭它，因为解决问题的方法要比问题多很多，而且像我这样的菜鸟还有很多，所以将这篇博客写下来，给予需要的人一些帮助。

> 例子：  
> 工程师Webapplication1（url是：[http://localhost/Webapplication1/webform1.aspx][http_localhost_Webapplication1_webform1.aspx]）
> 
> <table> 
>  <thead> 
>   <tr> 
>    <th align="left">符号</th> 
>    <th align="right">效果</th> 
>    <th align="center">例子</th> 
>   </tr> 
>  </thead> 
>  <tbody> 
>   <tr> 
>    <td align="left"><strong>~/</strong></td> 
>    <td align="right">只用服务端的空间可以识别</td> 
>    <td align="center">Webapplication1</td> 
>   </tr> 
>   <tr> 
>    <td align="left"><strong>/</strong></td> 
>    <td align="right">针对目录</td> 
>    <td align="center"><a href="http://localhost/" rel="nofollow">http://localhost/</a></td> 
>   </tr> 
>   <tr> 
>    <td align="left"><strong>./</strong></td> 
>    <td align="right">当前目录</td> 
>    <td align="center">Webapplication1下面的目录</td> 
>   </tr> 
>   <tr> 
>    <td align="left"><strong>../</strong></td> 
>    <td align="right">相对当前目录的上层目录</td> 
>    <td align="center"></td> 
>   </tr> 
>  </tbody> 
> </table>

#### end ####

谢谢您的细心的阅读！

[70]: /images/20210923/d7d0cd71db3a49e5b1dbbc9123132d67.png
[70 1]: /images/20210923/8eb19b93470f46deac448f8795d3040f.png
[70 2]: /images/20210923/ba492e556c874a90a1bba5b5e572b8d0.png
[70 3]: /images/20210923/5efea2e2319c41e2a754b9311caa083c.png
[70 4]: /images/20210923/346fb8774c534848ae4d41569b9d70fd.png
[70 5]: /images/20210923/9229397f116c4cc8b12dc1c1a3c80476.png
[70 6]: /images/20210923/56e3591a1bd24736bca4e4df5c9520d5.png
[http_localhost_Webapplication1_webform1.aspx]: http://localhost/Webapplication1/webform1.aspx