このページでは、初心者でも比較的使いやすいものだけを抜粋しています。また、スタイルシートの指定に関しては「外部CSS」に記述しているものとします。その他の記述方法は「スタイルシートの定義方法」を参照して下さい。
サンプルとして4方向にパディングを10px指定した場合
サンプル
div{
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
---または---
div{padding: 10px 10px 10px 10px;} /* 左から順に 上 右 下 左 */
div{padding: 10px;} /* 4辺一括指定 */
下記に省略のパターンを載せますので参考にして下さい。
| padding : 10px; | ４方向とも【10px】 |
| padding : 10px 10px; | 上・下方向に【10px】 右・左方向に【10px】 |
| padding : 10px 10px 10px; | 上方向【10px】 右・左方向【10px】 下方向【10px】 |
| 個別表示 | |
| padding : 10px 10px 10px 10px; | 左から順に【上】【右】【下】【左】 |
| padding-top : 10px; padding-left : 10px; |
上方向に【10px】左方向に【10px】 |
