CSSの記述順序
サイト制作の際に、CSSの記述順序がごちゃごちゃになったので、整理します。
ボックス幅
※コンテント：widthとheightプロパティで規定される長方形
パディング：padding
ボーダー辺に対し、コンテントの読みやすさを確保するために空ける空間を指します。
マージン：margin
関連する機能を視覚的にグループ化し、別の機能ブロックと区別しやすくします。
ブロックとブロックの間の空間を広げる設定です。
CSSの記述順序
- 上からこの順序で書くと迷わない
先生の書き方1
（1）color、font-family、font-size、font-style、font-weight、line-height（文字指定）
（2）margin、padding（空間指定）
（3）width、height（コンテントが入るエリア）
（4）background-color（背景色）
（5）background-image（背景画像）
（6）border（枠線）
先生の書き方2
（1）margin、padding（空間指定）
（2）width、height（コンテントが入るエリア）
（3）color、font-family、font-size、font-style、font-weight、line-height（文字指定）
（4）background-color（背景色）
（5）background-image（背景画像）
（6）border（枠線）
Mozillaの順序
- display
- list-style
- position
- float
- clear
- width
- height
- margin
- padding
- border
- background
- color
- font
- text-decoration
- text-align
- vertical-align
- white-space
- other text
- content
CSS2 Specification
margin
margin-top
margin-right
margin-bottom
margin-left
padding
padding-top
padding-right
padding-bottom
padding-left
border
border-top
border-bottom
border-right
border-left
border-width
border-top-width
border-right-width
border-bottom-width
border-left-width
border-color
border-top-color
border-right-color
border-bottom-color
border-left-color
border-style
border-top-style
border-right-style
border-bottom-style
border-left-style
display
position
top
right
bottom
left
float
clear
z-index
direction
unicode-bidi
width
min-width
max-width
height
min-height
max-height
line-height
vertical-align
overflow
clip
visibility
content
quotes
counter-reset
counter-increment
list-style
list-style-type
list-style-image
list-style-position
page-break-before
page-break-after
page-break-inside
orphans
widows
color
background
background-color
background-image
background-repeat
background-attachment
background-position
font
font-family
font-style
font-variant
font-weight
font-size
text-indent
text-align
text-decoration
text-shadow
letter-spacing
word-spacing
text-transform
white-space
caption-side
table-layout
border-collapse
border-spacing
cursor
empty-cells
speak-header
outline
outline-width
outline-style
outline-color
volume
speak
pause-before
pause-after
pause
cue-before
cue-after
cue
play-during
azimuth
elevation
speech-rate
voice-family
pitch
pitch-range
stress
richness
speak-punctuation
speak-numeral
speak-header
