css - mixins:增加 background-image 属性的值

Question

这是以下混入:

.a () {background-image: url(one.png);}

现在，我想要.b 继承.a 但它应该添加第二个背景图像层，例如:

.b {
    .a;                                 <-- import
    background-image: url(second.png);
}

将生成:

.b {
    background-image: url(one.png);
    background-image: url(second.png); /* wins */
}

并且不是

.b {
    background-image: url(one.png), url(second.png);
}

这是我想要的...

是否可以在 LESS 中处理这个问题？

Answer 1

这在 LESS 中是可能的，只是与你写的不完全一样。为了实现您正在寻找的内容，您必须将图像设置为变量，如下所示:

@a:url('../images/img-a.png') top left repeat;
@b:url('../images/img-b.png') top left repeat;

然后，当您定义一个类或 ID 时，您可以像这样添加变量:

.someClass {
    background:@a, @b;
}