padding(パディング)について

要素内の上・右・下・左の余白の幅を設定するプロパティです。

padding(パディング)の概念図

paddingのブラウザ表示例

■CSS記述
.sample1 { border:1px solid #ccc; padding:30px; }
■XHTML記述
<p class="sample1">サンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプル</p>

サンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプルサンプル

padding(パディング)の設定方法

上幅
padding-top: (値);
右幅
padding-right: (値);
下幅
padding-bottom: (値);
右幅
padding-left: (値);
一括指定
padding: (上) (右) (下) (左);

padding(パディング)の値

値は色々とありますが、
テンプレートではpxとemを使用しています。

mm , cm , in , pt , pc , em , ex , px , % , auto