Sass CSS Gradient Generator

时间:2012-05-22 03:38:19

标签: css sass

看看这个JSFiddle

  

http://jsfiddle.net/JamesKyle/wLkLE/2/

尝试使用SASS重新创建此外观http://jsfiddle.net/JamesKyle/EyxHE/3/,以便轻松修改。

这是我遇到麻烦的代码......

@for $i from 1 through $numberOfUnits {
  if $i == 1 {
    $lineargradient: $majorColor 0%, $majorColor $majorWidthPercent, $gapColor $majorWidthPercent, $gapColor $unitWidthPercent
  }
  else if $i > 1 {
    $minor-begin: ($i-1)*$unitWidthPercent;
    $minor-end: (($i-1)*$unitWidthPercent)+$minorWidthPercent;
    $gap-begin: $minor-end;
    $gap-end: $i*$unitWidthPercent;

    $lineargradient: #{$lineargradient}, $minorColor $minor-begin, $minorColor $minor-end, $gapColor $gap-begin, $gapColor $gap-end;
  }
}​

我不确定如何对其进行编码以使其输出:

$lineargradient: rgba(0,0,0,0.15)...

SASS documentation对如何做这样的事情不是很清楚

再次,您可以在JSFiddle表单中看到这一点:

  
    

http://jsfiddle.net/JamesKyle/wLkLE/2/

  

0 个答案:

没有答案