The relative path of the picture

in this case, the relative path of the picture is written in the style, as follows

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

now, uh, there are several calls to this style at the front desk, and other styles can be applied, but this url is wrong.

correctly display
clipboard.png
:http://localhost:8070/front/images/icon_sanjiaoxing.png


clipboard.png
path: http://localhost:8070/front/sysItem/images/icon_sanjiaoxing.png

the first thing that makes me wonder is why the path has changed. The second is not to use the absolute path, can there be a way to keep the relative path unchanged or what, is there a great god to solve the problem for me?

Mar.15,2022
The relative path of

is relative to the path of the page you currently use this style. I guess the location of the page you mistakenly displayed is / front/sysItem/ , while the path to show the correct page is: / front , and the location of your picture is under / front/images/icon_sanjiaoxing.png , so only the page under / front can display this picture correctly. If you put this style in the css file at the same level as the / images folder, and then reference the css file through an external link on any page, it should be ok.


I think you should check the project path if you open the home page of this project is http://localhost:8070 or http://localhost:8070/front/sysItem

in addition, check whether your picture URL is the same path as your project startup path

Menu