图片的相对路径

Question

这样的，图片的相对路径写在样式中，如下

  #userBtn select{
        width: 300px;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        border:solid 1px #ccc;
        background:url('./images/icon_sanjiaoxing.png') no-repeat scroll 275px transparent;
        background-size:15px 15px;
    }
    

现在呢前台有好几处调用这个样式，其他样式都能应用，唯独这个url不对。

正确的显示

路径：http://localhost:8070/front/images/icon_sanjiaoxing.png

错误的显示

路径：http://localhost:8070/front/sysItem/images/icon_sanjiaoxing.png

首先让我奇怪的就是路径为什么会变化。其次是不使用绝对路径能不能有个方法让相对路径不变或者怎样，有无有大神给我解惑下？

Answer 1

相对路径是相对于你当前使用该样式的页面的路径，我猜你错误显示的那个页面的位置是在：/front/sysItem/, 而显示正确的页面的路径是在：/front, 而你图片的位置是在/front/images/icon_sanjiaoxing.png这个路径下，这样也只有/front下的页面可以正确显示这个图片。你把这个样式放到与/images这个文件夹同级的css文件里，然后在任何页面通过外部链接的方式引用这个css文件，应该就ok了。

Answer 2

我觉得你应该检查一下 项目路径 如果你打开这个项目的首页是http://localhost:8070还是http://localhost:8070/front/sysItem

另外 再检查一下你的图片URL和你项目启动的路径是不是同一个路径