[CSS] 형제요소로 갯수 알아내기
·
🔥 TIL
2021.03.18 요소를 퍼센트로하여 적응형이나 반응형에서도 자유롭게 쓸 수 있는 템플릿이다. 이해를 확실히 하고자 다시 정리하게 되었다. 본 기법은 다양하게 응용할 수 있다. 원본 문서에서는 li 요소 갯수에 따라 블록 안의 배경색을 다양하게 매기는 것을 예시로 들었다. flexbox를 사용할 수 없는 환경이라 가정한다. 다음 코드에서는 float: left 를 사용하여 li 요소들을 띄운 상태이다. li { float: left; } /* li가 하나일 때 */ li:first-child:nth-last-child(1) { width: 100%; } /* li가 두개일 때 */ li:first-child:nth-last-child(2), li:first-child:nth-last-child(2) ~..