margin

指定する要素の表示領域周辺(要素の外側）の余白を指定するのに 以下のようなプロパティ宣言があります。 画像（IMG要素）や段落（P要素）、引用ブロック（BLOCKQUOTE要素）、表（TABLE要素） などのブロック要素がスタイル定義の対象となります。

　margin　　　　:　上下左右の余白
　margin-top　　:　上の余白
　margin-bottom　:　下の余白
　margin-left　　:　左の余白
　margin-right　:　右の余白

他に表示領域周辺の余白をまとめて指定する方法もあります。 上下左右まとめて10pxに指定するには「margin:10px」などとします。 上下余白5px、左右余白20pxとしたければ「margin:5px 20px」と指定 することができ、上余白5px、右余白10px、下余白20px、左余白30pxと したければ「margin:5px 10px 20px 30px」とします。

■左右段落の余白を30pxにしたい場合
　p　{margin-left:30px; margin-right:30px}
■段落間の空白行を制御したい場合
普通、P要素の前後には、通常1行分の空白が入ります。この空白行は margin-top,margin-bottomプロパティで調整できます。たとえば、 1行分の空白を半分に再設定したい場合は以下のようにします。
　p　{margin-top:0.5em; margin-bottom:0.5em}

　padding

paddingプロパティを設定することにより、要素の各辺とその内容と の間隔を設定することができます。指定する要素内の周辺の余白を指定 することができます。たとえば、背景色や枠線を指定した場合、その要素の 文字列と背景の枠との間隔設定を、paddingで設定します。 使い方は　margin　と同様です。

　padding　　　　　　:　上右下左（上下・左右）のパディング
　padding-top　　　：　上パディング
　padding-bottom　：　下パディング
　padding-left　　：　左パディング
　padding-right　　：　右パディング

P.tbox1 { FONT-SIZE: 16px; background-color: #ffd;}

上はパディング を指定しなかった場合、下はpadding:20px;を指定した場合です。

P.tbox2 { FONT-SIZE: 16px; background-color: #dff; padding:20px;}

　　　⇒　CLASS属性 ：　ドット「．」＋クラス名称