Programming/HTML, CSS
[CSS] 속성 선언 순서
리버김
2023. 11. 12. 01:01
CSS 속성의 선언 순서를 스스로 정리해 본 적이 없는 것 같아 네이버의 CSS 코드를 참고해 정해 보았다. 평소 best practice나 클린 코드 관련 글들에서 읽은 것과 결이 같아 좋은 기준이 될 것 같다.
- display - 표시(관련 속성: visibility)
- overflow - 넘침
- float - 흐름(관련 속성: clear)
- position - 위치(관련 속성: top, right, bottom, left, z-index)
- width & height - 크기
- margin & padding(그룹) - 간격
- border(그룹) - 테두리
- background(그룹) - 배경
- font(그룹) - 폰트(관련 속성: color, letter-spacing, text-align, text-decoration, text-indent, vertical-align, white-space 등)
- animation - 동작(관련 속성: animation, transform, transition, marquee 등)
- 기타 - 위에 언급되지 않은 나머지 속성들로 폰트의 관련 속성 이후에 선언하며, 기타 속성 내의 선언 순서는 무관함.