STUDY

[:nth-child] :nth-child 활용

꿀떡최고 2021. 11. 20. 15:34
반응형

10번 이후 모두

li:nth-child(n+10) {
	color: red
}

 

 

배수 선택

li:nth-child(7n) {
	color: red
}

 

 

1번부터 5번까지

li:nth-child(-n+5) {
	color: red
}

 

 

10번부터 20번까지

li:nth-child(n+10):nth-child(-n+20) {
	color: red
}

 

 

마지막에서 2번째

li:nth-last-child(2) {
	color: red
}

 

 

홀수

li:nth-child(odd) {
	color: red
}

li:nth-child(2n+1) {
	color: red
}

 

 

짝수

li:nth-child(even) {
	color: red
}

li:nth-child(2n) {
	color: red
}

 

 

반응형

'STUDY' 카테고리의 다른 글

[Angular] 프로젝트 시작, props, emit  (0) 2022.02.05
[axios] axios에 header 넣기  (0) 2021.11.24
[ANIMATION] animation 속성  (0) 2021.11.22
[오류 해결] backface-visibility: hidden  (0) 2021.11.17
[SQL] HAVING과 WHERE의 차이  (0) 2021.11.16