１．マージンの指定（個別）
マージンとは、ボックス要素の外側と隣接する親要素（たとえば、ＨＰ全体の枠など）との間隔のことです。
わかりやすく言えば、一つのテーブルがあったとして、このテーブルをＨＰの上の端からどのぐらい離すか・・とか、左からどのぐらい離すかとか、ピッタリくっつけるとかの指定をすると思ってください。

margin-top : ★;　　　　　　　（上側・★はキーワード、数値＋単位、％）
margin-right : ★;　　　　　　（右側・★はキーワード、数値＋単位、％）
margin-bottom : ★;　　　　（下側・★はキーワード、数値＋単位、％）
margin-left : ★;　　　　　　　（左側・★はキーワード、数値＋単位、％）


　　　　　　　　　　　　　　　　auto　　　（自動的にブラウザが設定）
数値＋単位はコチラを参考にしてください。
％は親要素に対しての割合でマージンを指定します。


２．マージンの一括指定

margin : ★;　　　　　　　　　　　（上下左右同じ）
margin : ★　★;　　　　　　　　 （上下、左右別）
margin : ★　★　★;　　　　　　（上、左右、下別）
margin : ★　★　★　★;　　　 （上、右、下、左別）

※指定の順番は崩せませんので注意。指定は上と同じ。
一番上は、すべてのマージンを同じで指定。
二番目は、上下と左右のマージンが違う指定。
三番目は、上、左右、下のマージンがそれぞれ違う指定。
四番目は、すべてを個別で指定する時に使います。


３．パディングの指定（個別）
パディングとは、上のマージンとは逆にボックス内の領域を指定します。
大抵の場合、テーブル内でのテキストの位置は、枠線にくっついてはいないですよね。
あれもパディングの指定によるものがほとんどです。（ＨＴＭＬでも指定可）

padding-top : ★;　　　　　　　（上側・★はキーワード、数値＋単位、％）
padding-right : ★;　　　　　　（右側・★はキーワード、数値＋単位、％）
padding-bottom : ★;　　　　（下側・★はキーワード、数値＋単位、％）
padding-left : ★;　　　　　　　（左側・★はキーワード、数値＋単位、％）

キーワード並びに数値＋単位、％の指定はマージンと同じです。


４．パディングの一括指定

padding : ★;　　　　　　　　　　　（上下左右同じ）
padding : ★　★;　　　　　　　　 （上下、左右別）
padding : ★　★　★;　　　　　　（上、左右、下別）
padding : ★　★　★　★;　　　 （上、右、下、左別）

指定についてもマージンと同じ順番での指定になります。


５．枠線の太さを指定（個別）

border-top-width : ★;　　　　　　（上側）
border-right-width : ★;　　　　　（右側）
border-bottom-width : ★;　　　（下側）
border-left-width : ★;　　　　　　（左側）

指定はキーワード、数値＋単位でします。

　　　　　　　　　　　　　　　thin　　　　　　（細い線）
　　　　　　　　　　　　　　　medium　　 （中くらいの線・既定）
　　　　　　　　　　　　　　　thick　　　　　（太い線）
数値＋単位は、上の指定と同じ。


６．枠線の太さを一括指定

border-width : ★;　　　　　　　　　　　（上下左右同じ）
border-width : ★　★;　　　　　　　　 （上下、左右別）
border-width : ★　★　★;　　　　　　（上、左右、下別）
border-width : ★　★　★　★;　　　 （上、右、下、左別）

指定は上と同じです。


７．枠線の色を指定（個別）

border-top-color : ★;　　　　　　　　（上側）
border-right-color : ★;　　　　　　　（右側）
border-bottom-color : ★;　　　　　（下側）
border-left-color : ★;　　　　　　　　（左側）

指定はキーワードtransparent（透明）、ＲＧＢ値、カラーネームでします。


８．枠線の色を一括指定

border-color : ★;　　　　　　　　　　　　（上下左右同じ）
border-color : ★　★;　　　　　　　　　 （上下、左右別）
border-color : ★　★　★;　　　　　　　（上、左右、下別）
border-color : ★　★　★　★;　　　　 （上、右、下、左別）

指定は上と同じ。（色はカラーネーム・RGB表を参考にしてください。）


９．枠線の種類を指定（個別）

border-top-style : ★;　　　　　　　　　（上側）
border-right-style : ★;　　　　　　　　（右側）
border-bottom-style : ★;　　　　　　（下側）
border-left-style : ★;　　　　　　　　　（左側）

指定はキーワード。

　　　　　　　　　　　　　　　　　none　　　　　　（枠線を非表示・既定）
　　　　　　　　　　　　　　　　　hidden　　　　 （表示しない）
　　　　　　　　　　　　　　　　　dotted　　　　　（点線）
　　　　　　　　　　　　　　　　　dashed　　　　 （破線）
　　　　　　　　　　　　　　　　　solid　　　　　　 （実線）
　　　　　　　　　　　　　　　　　double　　　　　（二重線）
　　　　　　　　　　　　　　　　　groove　　　　 （へこんだように見える線）
　　　　　　　　　　　　　　　　　ridge　　　　　　（浮き上がったように見える線）
　　　　　　　　　　　　　　　　　inset　　　　　　（内側がへこんだような線）
　　　　　　　　　　　　　　　　　outset　　　　　（内側が浮き上がったような線）


１０．枠線の種類の一括指定

border-style : ★;　　　　　　　　　　　（上下左右同じ）
border-style : ★　★;　　　　　　　　 （上下、左右別）
border-style : ★　★　★;　　　　　　（上、左右、下別）
border-style : ★　★　★　★;　　　 （上、右、下、左別）

指定キーワードは上と同じ。


１１．個別枠線ごとの一括指定

border-top : ★　☆　▲;
border-right : ★　☆　▲;
border-bottom : ★　☆　▲;
border-left : ★　☆　▲;

※★＝枠線の太さ（width）☆＝枠線の種類（style）▲＝枠線の色（color）


１２．枠線の一括指定
すべての枠線が同じで指定する時に使用します。

border : ★　☆　▲;

※★＝枠線の太さ（width）☆＝枠線の種類（style）▲＝枠線の色（color）


１３．内容領域の幅と高さを指定

width : ★;　　　　　　　　（幅）
height : ★;　　　　　　　（高さ）


　　　　　　　　　　　　　　　auto
数値＋単位の指定はコチラを参考にしてください。
％は親要素に対しての割合です。

↓全体の例のサンプルです。





枠線に関しては、頻繁に使うものなのでしっかりと覚えておくことが大事です。
普段よく使う指定は、１２番の指定法です。この形はぜひとも覚えていただきたいと思います。。
ここでの指定は、DIV,P,TABLE,SPAN,INPUT, TEXTAREAなどに効力を持ちますので、いろいろな場面で使えてとても重宝しますよ。
枠線を自由に扱えるということは、どんなものでも作れるということになりますので、テンプレートなども自由にカスタマイズできるようになりますね。というよりも、自分で作れるようにもなりますよ。(笑)