<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=Shift_JIS">
<TITLE>Webサイト</TITLE>
<STYLE TYPE="text/css">
<!--
BODY {
background-color: #FFFFFF; /* ページの背景色 */
margin: 0; /* ページのマージン */
}
BODY, TD {
font-size: 1em; /* 全体の文字サイズ */
color: #2B2B2B; /* 全体の文字色 */
}
A:link { color: #0000FF; } /* リンク文字の色 */
A:visited { color: #0000A0; } /* アクセス済みの色 */
A:hover { color: #FF0000; } /* ポイントしたときの色 */
A:active { color: #FF8000; } /* クリックした瞬間の色 */
#area_top { /* Aエリア（全体の指定） */
border-collapse: collapse; /* 枠線の表示方法（重ねる） */
background-color: #BDE9BA; /* 背景色 */
}
#area_top TD { /* Aエリア（セル内の指定） */
padding: 3px; /* 内側の余白 */
}
#area_middle { /* B・Cエリア（全体の指定） */
border-collapse: collapse; /* 枠線の表示方法（重ねる） */
margin-top: 10px; /* AエリアとB・Cエリア間の余白 */
margin-bottom: 10px; /* B・CエリアとDエリア間の余白 */
}
#left { /* Bエリア（セル内の指定） */
background-color: #FDEDC4; /* 背景色 */
vertical-align: top; /* 上揃え */
padding: 3px; /* 内側の余白 */
}
#right { /* Cエリア（セル内の指定） */
background-color: #FFFFFF; /* 背景色 */
vertical-align: top; /* 上揃え */
padding: 3px; /* 内側の余白 */
}
#area_bottom { /* Dエリア（全体の指定） */
border-collapse: collapse; /* 枠線の表示方法（重ねる） */
background-color: #E8E8FF; /* 背景色 */
}
#area_bottom TD { /* Dエリア（セル内の指定） */
padding: 3px; /* 内側の余白 */
}
-->
</STYLE>
</HEAD>
<BODY>
<DIV ALIGN="center">
<TABLE WIDTH="740" ID="area_top">
<TR>
<TD>
Aエリア
<BR>
<BR>
</TD>
</TR>
</TABLE>
<TABLE WIDTH="740" ID="area_middle">
<TR>
<TD WIDTH="180" ID="left">
Bエリア
</TD>
<TD WIDTH="5"></TD> <!--BエリアとCエリア間の余白-->
<TD WIDTH="555" ID="right">
Cエリア
<BR>
<BR>
・
・
・
</TD>
</TR>
</TABLE>
<TABLE WIDTH="740" ID="area_bottom">
<TR>
<TD>
Dエリア
<BR>
<BR>
</TD>
</TR>
</TABLE>
</DIV>
</BODY>
</HTML>
・これをブラウザで見ると次のように表示されます
|
|
