paddingプロパティは、要素の領域（パディング領域）を指定します
XXXX はスタイルシート記述です。
XXXX はHTML記述です。
XXXX 背景色と枠線は修飾対象要素の範囲です。
padding指定無しの表示を
とします。
value で上下左右の要素の領域を一括指定します。
| .p0 | { | padding | : | 1% | ; | } |
上記指定は、
| .p0 | { | padding-top | : | 1% | ; | |
| padding-right | : | 1% | ; | |||
| padding-bottom | : | 1% | ; | |||
| padding-left | : | 1% | ; | } |
と等価です。
value1 : 要素の上下領域指定
value2 : 要素の左右領域指定
| .p1 | { | padding | : | 0.5em 2em | ; | } |
上記指定は、
| .p1 | { | padding-top | : | 0.5em | ; | |
| padding-right | : | 2em | ; | |||
| padding-bottom | : | 0.5em | ; | |||
| padding-left | : | 2em | ; | } |
と等価です。
value1 : 要素の上側領域指定
value2 : 要素の左右領域指定
value3 : 要素の下側領域指定
| .p2 | { | padding | : | 1em 10% 0.5em | ; | } |
上記指定は、
| .p2 | { | padding-top | : | 1em | ; | |
| padding-right | : | 10% | ; | |||
| padding-bottom | : | 0.5em | ; | |||
| padding-left | : | 10% | ; | } |
と等価です。
value1 : 要素の上側領域指定
value2 : 要素の右側領域指定
value3 : 要素の下側領域指定
value4 : 要素の左側領域指定
| .p3 | { | padding | : | 1em 2em 3em 4em | ; | } |
上記指定は、
| .p3 | { | padding-top | : | 1em | ; | |
| padding-right | : | 2em | ; | |||
| padding-bottom | : | 3em | ; | |||
| padding-left | : | 4em | ; | } |
と等価です。