我们可以使用自定义功能扩展CSS吗？

Question

我们可以使用JavaScript构建自己的自定义函数来处理已解析的CSS吗？回到Sass，我们经常使用的功能是生成一个间距单位（根据基线高度计算），帮助创建一个简单且可维护的垂直节奏，其速度将比其他预处理器快或失控？我现在正在测试这些不同的方法，因此我想知道我做对了还是不做对，否则一切都会荡然无存？

$line-height: 32px;

/* vertical rhythm function */
@function vr($amount) {
  @return $line-height * $amount;
}

/* input */
.selector { margin-bottom: vr(2) }

/* output */
.selector { margin-bottom: 64px; }

/* input */
.selector { margin-bottom: 2vr }

/* output */
.selector { margin-bottom: 64px; }

var vr = function (css) {
  var lineHeight = 32;

  css.eachDecl(function (decl) {
    if (decl.value.match(/vr/)) {
      decl.value = lineHeight * parseFloat(decl.value) + 'px';
    }
  });
};