使用手写笔的 CSS3 实体阴影效果混合

Question

所以我想实现如下所示的阴影效果:http://zurb.com/playground/css-boxshadow-experiments#peri-table

但我想创建一个允许我指定阴影长度的混合，我的第一个方法是:

solidShadow(size, color = #000)
    shadows = '0px 0px #000'
    for n in size
        shadows += ', ' + n + 'px ' + n + 'px '
        shadows += color
    return shadows

被称为 box-shadow solidShadow(1..3) 这“有效”但实际输出是

-webkit-box-shadow:'0px 0px #000, 1px 1px #000, 2px 2px #000, 3px 3px #000';
box-shadow:'0px 0px #000, 1px 1px #000, 2px 2px #000, 3px 3px #000';

如果单引号 ' 不存在，它会正常工作。

Answer 1

明白了!答案是 unquote() 函数，所以它最终看起来像这样。

solidShadow(size, color = #000)
    shadows = '0px 0px #000'
    for n in size
        shadows += ', ' + n + 'px ' + n + 'px '
        shadows += color
    return unquote(shadows)

并被称为box-shadow solidShadow(1..3)