css - 如何用LESS自动生成一大串style

问题描述

问 题

.eg-pd-10 {
  padding: 10px
}
.eg-pd-20 {
  padding: 20px
}
.eg-pd-30 {
  padding: 30px
}
...
...
比如这里我希望能生成1-100之间的所以padding，怎么写这样的less。

解决方案

大概这样子
请参考官方文档loops-feature

.generate-eg-pds(4);

.generate-eg-pds(@n, @i: 1) when (@i =< @n) {
  .eg-pd-@{i}0 {
    padding:@i*10px;
  }
  .generate-eg-pds(@n, (@i + 1));
}

这篇关于css - 如何用LESS自动生成一大串style的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！