Less延伸

extend 是一个 Less 伪类，它通过使用 :extend 选择器在一个选择器中扩展其他选择器样式。

扩展语法

扩展可以是附加到选择器，也可以是集中放置在规则，看上去像是带有选择器参数的可选伪类，然后紧跟关键字 all 。

    // 第一个块和第二个块做同样的事
    .x:extend(.y) {}
    .x{ &:extend(.y);}
    
    // 扩展 .y 元素选择器的所有实例
    .x:extend(.y all){}
    
    // 仅扩展选择器输出为 .y 的实例
    .x:extend(.y){}

扩展附加到选择器

附加到选择器的扩展在我们看来像是一个普通的伪类，带有选择器作为参数，一个选择器可以包含多个extend子句，但是所有扩展都必须在选择器的末尾。

• 在选择器之后扩展：pre:hover:extend(div pre)。
• 选择器和扩展之间允许有空格：pre:hover :extend(div pre)。
• 允许多个扩展：pre:hover:extend(div pre):extend(.bucket tr)。
• 不允许的：pre:hover:extend(div pre).nth-child(odd)，扩展必须是最后一个。

如果规则集中包含多个选择器，那么它们中的任何一个都可以是具有extend关键字的，在一个规则集中扩展的多个选择器。

    .xkd_first,
    .xkd_second:extend(.vue),