如何使用less中的循环为排版创建特定的类名?

我想生成9个排版类,每个类都有以下内容:

font-size: 2rem;
line-height: 1rem;

我将使用标准的字体倍增器来确定字体大小和行高。我不想对所有这些CSS类进行硬编码,而是想知道是否有一种更优雅的方法可以用更少的资源在循环中生成它们。

我从另一条线索中发现了以下内容:

@iterations: 5;
.span-loop (@i) when (@i > 0) {
    .span-@{i} {
        width: ~"@{i}%";
    }
    .span-loop(@i - 1);
}
.span-loop (@iterations);

产生:

.span-5 {
  width: 5%;
}
.span-4 {
  width: 4%;
}
.span-3 {
  width: 3%;
}
.span-2 {
  width: 2%;
}
.span-1 {
  width: 1%;
}

这是相当接近,但我希望我的类名更“命名”。如何使用循环为以下对象生成类:

.small { }
.caption { }
.body { }
.subheader { }
.title { }
.headline { }

等。。。

我也不依赖于更少的语言,所以如果有更好的CSS预处理器语言,那么我很乐意使用它:)

谢谢您!