cssでのnth-child、first-child、last-childの使用(最初、いくつ目、いくつ目からいくつ目、最後などを選択)
817 ワード
liラベルと組み合わせて使用し、列のラベルを選択できます.
1.first-child選択リストの最初のラベル
2.Last-child選択リストの最後のラベル
3.nth-child(n)
ここでnは数字であり、選択リストのn番目のラベルを表す
例えば3番目のラベルを選択
4.nth-child(2n)
リストの偶数を選択し、2、4、6…個のラベルを選択します.
5.同理nth-child(2 n-1)は奇数ビットラベルが選択されていることを示します
6.4番目から最後のラベルを選択します.この4は必要な数字に変えることができます.
7. 1番目から4番目までの数字4を選択しても、必要に応じて置き換えることができます.
8.nth-last-child(3)は最後の3つのラベルを表す
あなたの役に立つことを願っています.
1.first-child選択リストの最初のラベル
2.Last-child選択リストの最後のラベル
li:first-child{color:red}
li:last-child{color:pink}
3.nth-child(n)
ここでnは数字であり、選択リストのn番目のラベルを表す
例えば3番目のラベルを選択
li:nth-child(3){color:pink}
4.nth-child(2n)
リストの偶数を選択し、2、4、6…個のラベルを選択します.
li:nth-child(2n){color:pink}
li:nth-child(2n-1){color:pink}
5.同理nth-child(2 n-1)は奇数ビットラベルが選択されていることを示します
6.4番目から最後のラベルを選択します.この4は必要な数字に変えることができます.
li:nth-child(n+4){color:pink}
7. 1番目から4番目までの数字4を選択しても、必要に応じて置き換えることができます.
li:nth-child(-n+4){color:pink}
8.nth-last-child(3)は最後の3つのラベルを表す
li:nth-last-child(3){color:pink}
あなたの役に立つことを願っています.