你可以在LESS css里面做一个javascript for循环吗?

我正在寻找一个for循环里面的Less.可以在Less里面做这个吗?我知道它有能力评估js,但在这个程度?

解决方法

我会推荐结账 Twitter Bootsrap.他们正在建设他们的网格系统.他们循环,递归,在一个较少的混合,而不是打字他们需要的每一个类.

有趣的部分是mixins.less文件,在less目录下面的“//网格”注释(第516行).有趣的部分是:

#grid {

    .core (@gridColumnWidth,@gridGutterWidth) {

      .spanX (@index) when (@index > 0) {
        (~".span@{index}") { .span(@index); }
        .spanX(@index - 1);
      }
      .spanX (0) {}

      ...

      .span (@columns) {
        width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
      }
 ...

这是在grid.less文件中以较少的目录这样的方式调用的:

#grid > .core(@gridColumnWidth,@gridGutterWidth);

哪些产生(除其他外):

.span12 {
  width: 940px;
}
.span11 {
  width: 860px;
}
.span10 {
  width: 780px;
}
...

bootstrap.css线170.

对于@gridColumnWidth,@gridGutterWidth和其余变量检查variables.less文件(第184行)

确保安装最后一个版本的lessc节点编译器.

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效