Frontend
CSS 선택자 명시도(Specificity): !important 없이 스타일 충돌 해결하기
CSS 명시도 점수 체계를 이해하고 !important 남용 없이 스타일 충돌을 해결하는 전략을 정리합니다.
02022. 9. 10.
#CSS8개
Frontend
CSS 속성 선택자: =, *=, $=, ^= 구문으로 유연하게 요소 선택하기
CSS 속성 선택자에서 =, *=, $=, ^= 구문을 사용해 요소를 더 유연하게 선택하는 방법을 정리합니다.
02022. 9. 10.
Frontend
nth-of-type와 nth-child의 차이 정리
순서 기준으로 자식 요소를 선택하는 CSS 가상 클래스 nth-of-type와 nth-child의 차이를 예시로 비교합니다.
02022. 9. 10.
Frontend
CSS 결합자(Combinators) 완벽 정리: 자손·자식·인접 형제·일반 형제
CSS의 네 가지 결합자(공백, >, +, ~)가 요소 사이의 관계를 어떻게 나타내는지 예시로 정리합니다.
02022. 9. 9.
Frontend
CSS counter로 ol 요소 순서 직접 표현하기
CSS counter-reset, counter-increment, counter() 속성으로 ol 요소의 순서를 원하는 모양으로 표현하는 방법을 정리합니다.
02022. 8. 27.
Frontend
CSS Grid에서 Text Ellipsis가 안 되는 이유와 minmax(0, 1fr) 해결법
CSS Grid 아이템에서 white-space: nowrap 말줄임이 동작하지 않는 원인을 min-width: auto 관점에서 살펴보고 minmax(0, 1fr)로 해결합니다.
02022. 5. 22.
Frontend
display:grid 사용시 text가 nowrap이 안되는 이슈 해결 방법
grid-template-columns의 1fr 때문에 white-space:nowrap이 동작하지 않는 문제를 minmax(0,1fr)로 해결합니다.
02022. 5. 8.
Frontend
프론트엔드 성능 최적화를 시켜줄 8가지 방법!!
리소스 압축, 폰트·이미지 최적화, 지연 로딩, CDN 등 프론트엔드 성능을 높이는 8가지 방법을 소개합니다.
02022. 4. 28.