CSS 선언 순서

CSS 코드가 점점 길어질수록 어디에 어떤 내용이 있는지 찾기가 힘들어진다. 선언 순서를 따르면 협업은 물론 혼자 개발을 할 때에도 도움이 될 것 같다.

모질라 파이어폭스 CSS 선언 순서

1. display
2. list-style
3. position
4. float
5. clear
6. width/height
7. padding/margin
8. border/background
9. color/font
10. text-decoration
11. text-align/vertical-align
12. white-space
13. other text
14. content

상세 버전

1. (레이아웃)
   1. display
   2. visibility
   3. overflow
   4. float
   5. clear
   6. position
   7. top
   8. right
   9. bottom
   10. left
   11. z-index
2. (Box)
   1. width
   2. height
   3. margin
   4. padding
   5. border
3. (배경)
   1. background
4. (폰트)
   1. color
   2. letter-spacing
   3. text-align
   4. text-decoration
   5. text-indent
   6. vertical-align
   7. white-space
5. (동작)
   1. animation
6. 기타