Question

Using the SASS solution as a reference，你如何使用LESS做到这一点？

h1, h2, h3,
h4, h5, h6 {
    @extend %headings !optional;
}

然后像这样使用它：

.element > %headings {
    color: red;
}

最终，我希望将来能够这样做：

.something {
    %headings { color: red; }
}

因此它会编译为：

.something h1,
.something h2,
.something h3 { color: red; }

Answer 1

就像在链接的答案中一样，有很多方法（例如使用extend，循环，parent selector或未命名的规则集。）

对于你的上一个片段，最合适的是带有ruleset as parameter（又名未命名/分离规则集）的mixin：

// define:
.headings(@style) {
    h1, h2, h3, h4, h5, h6 {
        @style();
    }  
}

// use:
.something {
    .headings({
        color: red;
    });
}

使用less来定位所有h标签

1 个答案: