Question

我一直潜伏着可以创建前缀关键帧声明的mixin，但是如果没有丑陋修复，我无法找到任何实际可行的内容。

到目前为止，我已设法创建以下mixin：

.keyframes(@identifier, @animation) {
  .frames { content: ~"'';} @-webkit-keyframes @{identifier} {@{animation}} @-moz-keyframes @{identifier} {@{animation}} @-ms-keyframes @{identifier} {@{animation}} @-o-keyframes @{identifier} {@{animation}} @keyframes @{identifier} {@{animation}"}
}

用法如下：

.keyframes(fade-in, ~"0% { opacity: 0; }50% { opacity: 0; }100% { opacity: 1; }");

我觉得这在可读性问题上是完全错误的，并且每次调用.frames { content: '' }; mixin时都会创建一个规则（.keyframes()）。

还有其他方法可以很好地吗？

旁注： 当我输入npm info less --version时，如果重要，则会返回1.4.28。

Answer 1

@ seven-phases-max对此有一些非常有用的评论。修复最终是使用css（https://github.com/postcss/autoprefixer）的后编译处理，这也帮助我/我目前正在与其他任务合作的团队。

详情请参阅问题中的评论。

关键帧mixin in LESS

1 个答案: