1

申請者の数に応じて追加の入力を動的に追加する、コース申請を処理する入力フォームがあります。各申請者は、名前、電子メール、電話番号を入力します。したがって、ユーザーが 2 人の応募者を選択した場合、フォームはデフォルトの 3 の後に 3 つの新しい入力を追加します。

3 つの入力の各グループの背景色を交互に変えて、フォームの使いやすさを改善したいと思います。たとえば、最初の 3 つを灰色、次の 3 つを白、次の 3 つを灰色などにします。

nth-child でこれを行うことができると思いますが、方法がわかりません。入力は独自の div にあるため、簡単に影響を与えることができます。それを実現するために nth-child ブラケットに何を入れればよいかわかりません。

4

2 に答える 2

3 
div:nth-child(6n),
div:nth-child(6n-1),
div:nth-child(6n-2){
    background-color: red;
}

http://jsfiddle.net/bmMjm/

于 2013-11-01T15:07:19.093 に答える
0

6 項目ごとに繰り返すパターンを実行しています。したがって、それをベースにする必要があります:nth-child(6n)。残念ながら、これは少し冗長になります...

input:nth-child(6n+1), input:nth-child(6n+2), input:nth-child(6n+3) {
    background: white;
}
input:nth-child(6n+4), input:nth-child(6n+5), input:nth-child(6n) {
    background: lightgrey;
}

jsフィドル

明らかにデフォルトはwhiteであるため、厳密に言えば最初のブロックは必要ありません。

于 2013-11-01T15:07:31.923 に答える