我想增加一个数字并从 csv 数组插入 $i 值#confused

Question

我做了这个#Swatch（https://codepen.io/ricoThaka/pen/YzMVdXj?editors=1100<~) i want to expand it to a flexible layout that can contain unlimited colors for the swatch

`
    .swatch div:nth-child(1) { background: DeepPink;}
    .swatch div:nth-child(2) { background: cyan;}
    .swatch div:nth-child(3) { background: GreenYellow;}
    .swatch div:nth-child(4) { background: CornflowerBlue;}
    .swatch div:nth-child(5) { background: Coral;}
`

这就是我想要以指数方式增加和操纵的值，在一个漂亮的#CSSGRid中，有点像蜘蛛网到我妻子的手机屏幕，这就是我们谈论@normani的方式

`    i=1
    until [ $i -gt 8 ];
    do
     echo ".swatch div:nth-child($i){ background: ;}"
      ((i=i+1))
    done 

    .swatch div:nth-child(1){ background: ;}
    .swatch div:nth-child(2){ background: ;}
    .swatch div:nth-child(3){ background: ;}
    .swatch div:nth-child(4){ background: ;}
    .swatch div:nth-child(5){ background: ;}
    .swatch div:nth-child(6){ background: ;}
    .swatch div:nth-child(7){ background: ;}
    .swatch div:nth-child(8){ background: ;}
`

如何加载背景十六进制值？我将它们存储在文件中 ~>

`    ``` for i in `cat colorvalues.csv`; do echo "$i"; done ``` 
#9acd32
#efcc00
#ffd300
#ffae42
#ffef00
#fefe33
#0014a8
#2c1608... like i want to feed that list like this 
    .swatch div:nth-child(1){ background: #xxxxxx ;}
    .swatch div:nth-child(2){ background: #xxxxxx ;}
    .swatch div:nth-child(3){ background: #xxxxxx ;}
    .swatch div:nth-child(4){ background: #xxxxxx ;}
`

#BASH_iNTERPETER = https://www.onlinegdb.com/edit/0LXwgPkFV

它应该创建一堆 div，我只是将 html r 中的 div 粘贴到我的 css 文件中为空 `

  i=1
    until [ $i -gt 8 ];
    do
      echo ".swatch div:nth-child($i){ background: ;}"
      ((i=i+1))
    done 

    .swatch div:nth-child(1){ background: ;}
    .swatch div:nth-child(2){ background: ;}
    .swatch div:nth-child(3){ background: ;}
    .swatch div:nth-child(4){ background: ;}
    .swatch div:nth-child(5){ background: ;}
    .swatch div:nth-child(6){ background: ;}
    .swatch div:nth-child(7){ background: ;}
    .swatch div:nth-child(8){ background: ;}


    ...Program finished with exit code 0
    Press ENTER to exit console.`

Answer 1

你很接近了。也许是这样的：

#!/bin/bash
#set -x
make_swatches() {
    counter=1
    swatches=''
    input_file=$1
    limit=$2
    template=".swatch div:nth-child(%d){ background: %s; }"
    while read swatch; do
        swatches+="$(printf "$template\n" "$counter" "$swatch")"$'\n'
        ((counter++))
        [[ "$counter" -gt "$limit" ]] && break
    done < "$input_file"
    echo "$swatches"
}

make_swatches colorvalues.csv 8