在less.js中,我能够用变量替换值而没有问题.
@gutter: 20px;
margin-left:e(%("-%d"),@gutter);
当尝试用变量替换属性时,我得到错误.我如何在Less中执行以下操作？
@gutter: 20px;
@direction: left;
e(%("margin-%d"),@direction):e(%("-%d"),@gutter);
解决方法
感谢Alvivi的解决方案和研究(您可以获得奖励).我决定添加以下作为实际答案,因为这是一个真正的设置方式而不是查看.blah()伪代码.
这是设置它的真正策略：
@gutter: 20px; @dir: left; @dirOp: right;
然后创建mixins来增强边距和填充,如下所示：
.margin(left,@dist:@gutter) {
margin-left:@dist;
}
.margin(right,@dist:@gutter) {
margin-right:@dist;
}
.padding(left,@dist:@gutter) {
padding-left:@dist;
}
.padding(right,@dist:@gutter) {
padding-right:@dist;
}
.lr(left,@dist: 0) {
left: @dist;
}
.lr(right,@dist: 0) {
right: @dist;
}
..那么你可以
#selector {
.margin(@dir);
}
要么
#selector {
.margin(@dirOp,10px);
}
全部一起：
#selector {
.margin(@dir);
.margin(@dirOp,50px);
.padding(@dir,10px);
.padding(@dirOp);
float:@dir;
text-align:@dirOp;
position:absolute;
.lr(@dir);
}
轻松轻盈LTR / RTL,轻松！活泉！
