今天碰到以下情况:
.a {
&:extend(.b);
}
.b {
color: red;
.c {
color: green;
}
}
.a
想完全继承.b
及其孩子的属性. 但是上面的代码只会被翻译为
.b,
.a {
color: red;
}
.b .c {
color: green;
}
可以看到没有产生我想要的.a .c { color: green; }
的效果. 看了一下Less: Extend Syntax才知道还要加一个all
才行.
.a {
&:extend(.b all);
}
.b {
color: red;
.c {
color: green;
}
}
翻译的css如下:
.b,
.a {
color: red;
}
.b .c,
.a .c {
color: green;
}