有没有办法为较少的文件设置一个通用的镜像路径？
有没有办法为较少的文件设置一个通用的镜像路径？
提问于 2011-06-09 22:08:59
我使用的是LESS样式语言。
考虑以下CSS：
.side-bg
{
background:url(../img/layout/side-bg.jpg) top no-repeat;
}现在，我的所有图像都在文件夹../img/中，我希望能够设置一个变量作为图像路径，并像这样使用它：
@image-path: ../img;
.side-bg
{
background:url(@image-path/layout/side-bg.jpg) top no-repeat;
}然而，这并不起作用。这不是什么大问题，如果图片文件夹发生了变化，我总是可以使用“查找和替换”。我刚刚开始学到更少的东西，想知道这样的事情是否可能发生。
回答 6
Stack Overflow用户
回答已采纳
发布于 2011-06-10 01:14:22
尝试使用字符串插值来做这样的事情。在docs中查找“变量插值”。
@base-url: "http://assets.fnord.com";
background-image: url("@{base-url}/images/bg.png");Stack Overflow用户
发布于 2012-06-08 22:32:48
解决方案：
.side-bg
{
background : ~"url( '@{image-path}/layout/side-bg.jpg' )" top no-repeat;
}Stack Overflow用户
发布于 2013-01-05 19:23:08
我正在搜索同样的问题，找到了这个页面。我想我会发布我的解决方案，因为其他人可能会发现它很有用...
@iconpath: '/myicons/';
.icon (@icon) {
background: no-repeat url('@{iconpath}@{icon}');
}
.icon-foo { .icon('foo.png'); }
.icon-bar { .icon('bar.png'); }
.icon-spuds { .icon('spuds.png'); }它编译为(使用http://winless.org/online-less-compiler)
.icon-foo {
background: no-repeat url('/myicons/foo.png');
}
.icon-bar {
background: no-repeat url('/myicons/bar.png');
}
.icon-spuds {
background: no-repeat url('/myicons/spuds.png');
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/6294126
复制相关文章
相似问题