小编Hai*_*yen的帖子

在一些css类中使用less来为不同的分辨率包装css样式会很不错.

我想做点什么:

footer {
  width: 100%;
}

.tablet {
  footer {
    width: 768px;
  }
}

.desktop {
  footer {
    width: 940px;
  }
}

最后这样的结果应该是结果:

footer {
  width: 100%;
}

@media screen and (min-width: 768px) {
  footer {
    width: 768px;
  }
}

@media screen and (min-width: 992px) {
  footer {
    width: 940px;
  }
}

.tablet可能看起来像这样:

@media screen and (min-width: 768px) {
  .tablet {

  }
}

希望有人有个好主意!

我在 LESS 文件中创建 2 个变量

@navSpritePath: '/i/data-board/navigation/navigation-sprite.gif';
@navSpritePath2x: ~`@{navSpritePath}.replace(/\.[\w\?=]+$/, function(match) { return "@2x" + match; })`;

有没有办法抽象@navSpritePath2x的分配，以便我只需传递执行函数的路径并返回字符串？

LESS 有自己的数学和颜色辅助函数。我想创建自己的，所以它看起来像：

@navSpritePath: '/i/data-board/navigation/navigation-sprite.gif';
@navSpritePath2x: createPath2x(@navSpritePath);

///sudo code - does not work
.createPath2x (@path){
    ~`@{path}.replace(/\.[\w\?=]+$/, function(match) { return "@2x" + match; })`;
}