Sass Color関数リストグラデーション

Question

私のリストの各%liタグに異なるbackground-colorを割り当てようとしています。私はそれらの色の色のいずれか、または2つの記載された色の間の勾配を使用したいと思います。ああそう人気のClearのようなものです。私は...

$this_color: darken($that_color, 10%) 

を軽減し、SASSで色を暗くする機能に精通してるしかし、それを超えて、私は私が探しているに影響を作成する方法を知りません。視覚的に、ここで私が何をしようとしていますものです：ここ

%ul 
    %li full color 
    %li darken 5% 
    %li darken 10% 
    ... 

Answer 1

は、それが色にループ内の1つの
http://jsfiddle.net/STuD5/1/

Answer 2

// set your color 
$backgroundColor: red 

// set the scale/increment for the function 
$backgroundColorScale: 8 

// number of items in your list 
$numberOfItemsInList: 10 

// here's a custom function to change the color 
// but you could make this fairly advanced 
// and shift color, saturate, etc. 
@function -modify-bg($bgcolor, $counter, $depth: $backgroundColorScale) 
    @return lighten($backgroundColor, ($i * $backgroundColorScale)) 

// here's the loop that steps through LIs and assigns each a new bg 
$i: 0 
@while $i < $numberOfItemsInList 
    li:nth-child(#{$i}) 
    background-color: -modify-bg($backgroundColor, $i) 
    $i: $i + 1 

ずつを変更 行うための一つの方法です