Less Extend 僅支援精確匹配

以下少

div.paragraph{
  color: blue;
}

*.paragraph{
  color: green;
}

.otherClass.paragraph{
  color: red;
}

.paragraph.otherClass{
  color: darkgrey;
}

.parent{
  .nestedParagraph{
    &:extend(.paragraph);
  }
}

將編譯成

div.paragraph {
  color: blue;
}
*.paragraph {
  color: green;
}
.otherClass.paragraph {
  color: red;
}
.paragraph.otherClass {
  color: darkgrey;
}

使用以下 HTML

<div class="parent">
  Parent Words
  <div class="nestedParagraph">
    Nested Words
  </div>
</div>

<div class="paragraph">
  Paragraph
</div>

<ul class="paragraph">
  ul paragraph
  <li>1</li>
  <li>2</li>
</ul>

<div class="otherClass paragraph">
  Other Class Paragraph
</div>

<div class="paragraph otherClass">
  Other Class Paragraph
</div>

我們的結果是

我們可以看到 Less Extend 僅支援精確匹配，因為巢狀的單詞沒有應用樣式。