Frontend·0 views·2022. 9. 10.
CSS 선택자 명시도(Specificity): !important 없이 스타일 충돌 해결하기
CSS 명시도 점수 체계를 이해하고 !important 남용 없이 스타일 충돌을 해결하는 전략을 정리합니다.

tag/CSS
8개
CSS 명시도 점수 체계를 이해하고 !important 남용 없이 스타일 충돌을 해결하는 전략을 정리합니다.

CSS 속성 선택자에서 =, *=, $=, ^= 구문을 사용해 요소를 더 유연하게 선택하는 방법을 정리합니다.

순서 기준으로 자식 요소를 선택하는 CSS 가상 클래스 nth-of-type와 nth-child의 차이를 예시로 비교합니다.

CSS의 네 가지 결합자(공백, >, +, ~)가 요소 사이의 관계를 어떻게 나타내는지 예시로 정리합니다.

CSS counter-reset, counter-increment, counter() 속성으로 ol 요소의 순서를 원하는 모양으로 표현하는 방법을 정리합니다.

CSS Grid 아이템에서 white-space: nowrap 말줄임이 동작하지 않는 원인을 min-width: auto 관점에서 살펴보고 minmax(0, 1fr)로 해결합니다.

grid-template-columns의 1fr 때문에 white-space:nowrap이 동작하지 않는 문제를 minmax(0,1fr)로 해결합니다.

리소스 압축, 폰트·이미지 최적화, 지연 로딩, CDN 등 프론트엔드 성능을 높이는 8가지 방법을 소개합니다.
