https://hmaster.net/


HTMLタグとCSSを使いメモ帳だけで無料でホームページを作成する 方法を分かりやすく解説しているサイトです。 初心者向けに見やすい、読みやすい作りになっています。

枠線の表示方法を指定する

テーブルタグに下記の属性を追加すると枠線の表示方法を変えることができます。


属性説明
frame="表示方法"(IE限定) テーブルの外側の 枠線の表示方法を指定します。
above…上側の枠線だけ表示します。
below…下側の枠線だけ表示します。
lhs…左側の枠線だけ表示します。
rhs…右側の枠線だけ表示します。
hsides…上側の枠線と下側の枠線だけ表示します。
vsides…左側の枠線と右側の枠線だけ表示します。
boxまたはborder…全ての外枠を表示します。
void…全ての外枠を表示しません。
rules="表示方法"(IE限定) テーブルの内側の 枠線の表示方法を指定します。
all…全ての内枠を表示します。
rows …内側の横の枠線だけ表示します。
cols …内側の縦の枠線だけ表示します。
none …全ての内枠を表示しません。
groups …グループ(<thead> <tfoot> <tbody> <colgroup>など)
の境界線だけ表示します。

■ テーブルの外側の枠線の表示方法を指定する

【ブラウザ表示】

1.テーブルの外側の枠線の表示方法を指定します。 (1行1列のテーブルでの表示例)

above
below
lhs
rhs
hsides
vsides
boxかborder
void


ソース(aboveのみ、他のソースは省略)

<table border="1" frame="above">
<tr>
<td>above</td>
</tr>
</table>

■ テーブルの内側の枠線の表示方法を指定する

2.テーブルの内側の枠線の表示方法を 指定します。(3行3列のテーブルでの表示例)

allallall
allallall
allallall
rowsrowsrows
rowsrowsrows
rowsrowsrows
colscolscols
colscolscols
colscolscols
nonenonenone
nonenonenone
nonenonenone

groupsgroupsgroups
groupsgroupsgroups
groupsgroupsgroups
groupsgroupsgroups
groupsgroupsgroups
groupsgroupsgroups

<table rules="groups">のテーブルのソースだけ載せておきます。

ソース(左)

<table border="1" rules="groups">
<colgroup span="2">
<tr>
<td>groups</td><td>groups</td><td>groups</td>
</tr>
<tr>
<td>groups</td><td>groups</td><td>groups</td>
</tr>
<tr>
<td>groups</td><td>groups</td><td>groups</td>
</tr>
</table>


ソース(右)
<table border="1" rules="groups">
<thead>
<tr>
<td>groups</td><td>groups</td><td>groups</td>
</tr>
</thead>

<tfoot>
<tr>
<td>groups</td><td>groups</td><td>groups</td>
</tr>
</tfoot>

<tbody>
<tr>
<td>groups</td><td>groups</td><td>groups</td>
</tr>
</tbody>
</table>

このエントリーをはてなブックマークに追加 Instagram

■ その他の項目

テーブルを作る
横幅、高さを指定する
画像や背景色を指定する
表示位置を指定する
テーブルに表題をつける
間隔、余白を指定する
セルを結合する
枠線の色やスタイルを指定する
行と列をグループ化する
細い枠線のテーブル
テーブルを横に並べる
テーブルで空白を作る

HTMLタグ一覧のページに戻る