2

css ファイル:nth-child(1)でなどを使用して、23 の独自の表示スタイルと配置スタイルを使用するグリッド パターンを作成しました。:nth-child(2)

目的は、パターンを 24 番目の要素で最初の子スタイルに繰り返すことです。次のような例を見てきました:nth-child(2n+1):が、パターンは十分に繰り返されていないため、1 から 23 までのループが最適だと感じています。

例えば

div:nth-child(1)
div:nth-child(2)
---
div:nth-child(23)
loop

私の推測では、jQuery のスポットが必要ですが、検索/jsfiddles からの私の試みは、これまでのところ非常に貧弱です。

これが理解しやすいことを願っています。

4

3 に答える 3

4

私が正しく理解した場合:

div:nth-child(n+23){ ... }    
div:nth-child(n+47){ ... }    
div:nth-child(n+71){ ... }
...

http://jsfiddle.net/dUXrC/

ただし、23 DIVS ごとに同じスタイルを繰り返したい場合は、次のようにします。

div:nth-child(23n+1){ ... }    
div:nth-child(23n+2){ ... }   
div:nth-child(23n+3){ ... }    
...

http://jsfiddle.net/dUXrC/1/

于 2013-07-04T21:39:56.537 に答える
1

あなたの質問は、少なくとも私にとっては、実際にはあまり明確ではありません。

実際

私はこれがそれを釘付けにするものだと思います:

div:nth-child(24n-23) /* 1 */
{
    background-color: red;
}

div:nth-child(24n-22) /* 2 */
{
    background-color: green;
}

/* --- */

div:nth-child(24n-16) /* 8 */
{
    background-color: cyan;
}

フィドル: http://jsfiddle.net/czWkE/2/

ここで行っていることは、24 番目の要素ごとに選択し、その前にいくつかの要素を取得することです。

前:

私はこれを思いつきました:http://jsfiddle.net/czWkEdiv 、それからセレクターと同じだと笑った。

1st、2nd、3rd ... 24th をそれぞれ異なる色にしたい場合は、次のことができます: http://jsfiddle.net/czWkE/1/

div:nth-child(1n)
{
    background-color: red;
}

div:nth-child(2n)
{
    background-color: green;
}

/* --- */

div:nth-child(24n)
{
    background-color: cyan;
}

基本的に、子番号に追加nすると、 ごとに繰り返されますnth

于 2013-07-04T21:38:59.387 に答える