外側、内側の余白を指定する

{margin:値;}、{margin-位置:値;}でテーブルの外側（周囲）の余白を指定することが出来ます。 値はpx、%などで指定します。

■ 余白の指定

テーブルの外側（周囲）の余白の指定パターンは以下の通り。（marginの方）

【ブラウザ表示】

天井
<table class="sample11">
<tr>
<td>テーブルの上下に30pxの余白</td>
</tr>
</table>
床

table.sample11{
border:1px black solid;
margin:30px 0px;
}

天井
<table style="border:1px black solid; margin:30px 0px;">
<tr>
<td>テーブルの上下に30pxの余白</td>
</tr>
</table>
床

■ セルの内側の余白を指定する

【ブラウザ表示】

<table class="sample5">
<tr>
<td class="cellyohaku">内側の余白30px</td>
</tr>
</table>

table.sample5{border:1px black solid;}
td.cellyohaku{
border:1px black solid;
padding:30px;
}

<table style="border:1px black solid;">
<tr>
<td style="border:1px black solid; padding:30px;">
内側の余白30px
</td>
</tr>
</table>

■ その他の項目

スタイルシート一覧のページに戻る