Twitter引导程序的多个过渡

Question

我想在bootstrap v2.1.0，

中对两个属性进行动画

opacity和margin。

我尝试过：

.transition(opacity 0.5s, margin 0.25s);：无输出
.transition('opacity 0.5s, margin 0.25s');：无效CSS输出
.transition(opacity 0.5s); .transition(margin 0.25s);：边距覆盖不透明度。

请注意，我正在使用lessphp，因此使用JavaScript Regex的解决方案将无法使用。

我知道我可以复制Mixin并将其修改以接受两个参数，但这似乎只是骇客，肯定有更好的方法？

Answer 1

两个选项（取决于少的版本）

少（1.3.3 ）

Less2css.org在实验中显示了这项工作的1.3.2，但问题文档似乎表明这是1.4释放的添加。

每当有效时，在某个时候，将其作为参数混合蛋白的可能变量分离器引入，同时仍允许逗号。;的存在导致逗号被视为分离变量，而是作为变量本身的 value 的一部分（逗号分隔列表）。然后，这允许（引用该站点）我们使用"使用一个包含逗号分隔的CSS列表的参数创建Mixin调用的虚拟Semicolon"。

因此，以下作品可产生与上述输出相同的，而无需逃脱字符串（ note " dummy" semicolon放在末端在之前的右括号之前，参数混音呼叫的括号）：

.transition(opacity 0.5s, margin 0.25s;);
                                      |
                                semicolon here

少（pre 1.3.3，但也可以在以后的版本中起作用）

为传递的变量中的字符串插值（~）：

.transition(~"opacity 0.5s, margin 0.25s");

两个解决方案输出：

-webkit-transition: opacity 0.5s, margin 0.25s;
-moz-transition: opacity 0.5s, margin 0.25s;
-o-transition: opacity 0.5s, margin 0.25s;
transition: opacity 0.5s, margin 0.25s;