LESS css 用 mixin 设置动态背景图片
我正在使用 LESS CSS 。
我目前正在使用带有变量的 Mixin。
这样的东西可以正常工作:
.border-radius (@radius) { border-radius: @radius; }
#header { .border-radius(4px); }
这是不是:
.bg-img(@img) { background-image:url(@img); }
#logo { .bg-img("../images/logo.jpg"); }
我尝试过使用 ' & 的组合" 在 background-image:url ('') & ("") 中,但随后它尝试将图像获取为 images/@img
而不是图像名称否则它会给我一个错误Cannot call method 'charAt' of undefined
我认为一直写 background-image:url()
太乏味了,这可能吗..?
I am using LESS CSS .
I am currently using Mixins with variables.
Something like this works okay :
.border-radius (@radius) { border-radius: @radius; }
#header { .border-radius(4px); }
This is not :
.bg-img(@img) { background-image:url(@img); }
#logo { .bg-img("../images/logo.jpg"); }
i have tried combinations of using ' & " in the background-image:url ('') & ("") but then it tries to get the image as images/@img
instead of the image name. other wise it gives me an error ofCannot call method 'charAt' of undefined
I think writing background-image:url()
all the time is too tedious, is this possible..?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
:) 得到了我的答案!
在我的例子中需要这样使用:
:) got my answer!
it needs to be used like this in my case :
您可以通过将图像路径的第一部分添加到初始 mixin 来进一步改进这一点,这样您只需编写一次:
一个小的改进,但确实增加了一点优雅。
You can further improve on this by adding the first part of the image path to the initial mixin so you only have to write it once:
A small improvement but does add a little elegance.