带有相对路径的 LESS CSS 背景

我在使用 LESS 作为我的网站的样式表时遇到了问题。就我个人而言，我宁愿在CSS中使用相对路径而不是绝对路径（这只是我的习惯），但是现在当我使用带有导入功能的LESS时，我遇到了如下所示的问题。

我有一个main.less根文件夹中的文件

@import "inc/inc.less";

和一个文件inc.less在文件夹中inc

.homeBgr {  
    background: url('icons/Home.gif');
}

图片Home.gif位于文件夹中/root/inc/icons

 - main.less
      - inc
         - inc.less
         - icons
            - Home.gif

with lessc输出是

.homeBgr {  
    background: url('icons/Home.gif');
}

然而，我的期望是

.homeBgr {  
   background: url('inc/icons/Home.gif');
}

如果我使用 less.js 作为客户端编译器，我会得到预期的输出，但是如果我使用lessc， 我不。

有没有人遇到过同样的问题，并且有解决方案？或者说，关于如何让它发挥作用的任何建议。提前致谢。

你必须使用 .less 的转义功能。它看起来像这样。 firebug 它或使用类似 chromes firebug 的东西来检查路径（如果这不起作用并且您需要将其调整到根文件夹）。不过你至少可以在它逃脱后调整它。

background: ~"url('inc/icons/Home.gif')";