-
/* 3, 6, 9, 12 번째(3의배수) 배경변경 */ li:nth-child(3n){ background: red; } /* 10번째 부터 이후 모든 리스트 컬러변경 */ li:nth-child(n+10) { color: blue; } /* 1번째 부터 5번째 까지 배경변경 */ li:nth-child(-n+5) { background: green; } /* 15번째 부터 20번째 까지 배경변경 */ li:nth-child(n+15):nth-child(-n+20) { background: hotpink; } /* 끝에서 부터 3번째 */ li:nth-last-child(3) { background: gold; } /* 홀수 */ li:nth-child(odd) { color: red; } /* 짝수 */ li:nth-child(even) { color: red; }
'工夫 > HTML+CSS' 카테고리의 다른 글
[CSS] 언어별 줄바꿈 word-wrap / word-break (0) 2022.02.09 [HTML] 카카오톡 URL 공유시 미리보기 메타태그작성 (0) 2022.02.06 [CSS] FLEX 의 기본사용법 (0) 2021.05.19 [HTML] 크롬 자동번역창을 띄우지 않기 (0) 2021.05.12 [CSS] 모바일에서 뷰포트에 따른 폰트 사이즈 자동 조정 방지 (0) 2021.05.12 댓글