|
table のタグに frame の属性を使って テーブルの外枠線の表示方法を設定することができます。
まずは通常のテーブルと見比べて どんなふうになるのか確認してみましょう。
これは 通常のテーブルです border は 3 bordercolor は #0000ff です。
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
<table frame="○"> で 外枠の表示方法を指定します。
指定できる値は 次のとおりです
| void |
外枠なし（デフォルト） |
| above |
上だけ表示 |
| below |
下だけ表示 |
| hsides |
上下だけ表示 |
| vsides |
左右だけ表示 |
| lhs |
左だけ表示 |
| rhs |
右だけ表示 |
| box |
外枠すべて表示 |
| border |
四辺の縁取り |
では 実際にどのように表示されるか見てみましょう。
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| <table frame="void"> |
<table frame="avobe"> |
<table frame="below"> |
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| <table frame="hsides"> |
<table frame="vsides"> |
<table frame="lhs"> |
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| mamoho |
おとうさん |
| だいすけ |
おにいちゃん |
| なみ |
いもうと |
|
| <table frame="rhs"> |
<table frame="box"> |
<table frame="border"> |
HTMLソースは こんな感じです。
<table frame="void" width="210" border="3" bordercolor="#0000FF">
<tr>
<td width="80">mamoho</td>
<td width="110">おとうさん</td>
</tr>
<tr>
<td>だいすけ</td>
<td>おにいちゃん</td>
</tr>
<tr>
<td>なみ</td>
<td>いもうと</td>
</tr>
</table> |
|
