所以我试图做一个LESS混合，它需要一个数字(度旋转)和输出正确的CSS来旋转元素。问题是，我不能想出一个方法来为IE写“270deg”和“3”(270/90)。这里是我试过的事情：
.rotate(@rotation: 0) {
@deg: deg;
-webkit-transform: rotate(@rotation deg); // i can see why this doesn't work
-moz-transform: rotate((@rotation)deg); // parens
-o-transform: rotate(@rotation+deg); // variable-keyword concatenation
transform: rotate(@rotation+@deg); // variable-variable concatenation
// this is the reason I need @rotation to be just a number:
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=@rotation/90);
}
.someElement {
.rotate(270)
}
解决方法
一个解决方案，虽然有点丑陋，将是使用转义字符串：
@degs: ~"@{rotation}deg"
@degs-ie: @rotation / 90;
transform: rotate(@degs);
filter: ~"DXImageBlahBlah(rotation=@{degs-ie})"
注意，你需要less.js v1.1.x。
