損をしない自動車保険選び損をしないクレジットカード選び銀行の利用・口座維持手数料無料化就職・アルバイト情報
タブ切り替え風のホームページ
▲
テーブルを使って、タプで切り替えているように見せかけることができます。
使用例を下に載せていますが、わかりやすいように枠線は表示にしてあります。
「A」のページには上の例のようなテーブルを一番上につけ、「B」のページには2番目例のようなテーブルをやはり一番上につけておきます。
同様にページの数だけ、セルの色分けを変えたテーブルをつくり、各々のページの一番上につけます。
テーブルのセル中の文字にリンクを張っておけば、一見タブで切り替えているように見せることができます。
テーブルには「cellspacing="0"」の指示を入れ、余計な隙間が開かないようにします。
テーブルにスタイルシートを使ったり、画像を入れたりすれば、見せ方に変化をつけることもできます。
この例の場合はこんな指示をしています。
上のテーブルの記入例
<table border="0" cellspacing="0" width="100%"><tr>
<td width="15%" bgcolor="#7D7DFF"><FONT color="#FFFFFF"><B>A</B></Font></td>
<td width="1%"> </td>
<td width="15%" bgcolor="#E1E1FF"><a href="bb,htm">B</a></td>
<td width="1%"> </td>
<td width="15%" bgcolor="#E1E1FF"><a href="cc.htm">C</a></td>
<td width="1%"> </td>
<td width="15%" bgcolor="#E1E1FF"><a href="dd.htm">D</a></td>
<td width="1%"> </td>
<td width="15%" bgcolor="#E1E1FF"><a href="ee.htm">E</a></td>
<td width="1%"> </td>
<td width="20%" bgcolor="#E1E1FF"><a href="ff.htm">F</a></td>
</tr>
<tr>
<td colspan="11" bgcolor="#7D7DFF"> </td></tr></table>