ここでは、<table> タグの属性を変更することで、どのように表示が変わるかメモっておく。
<table> タブには多くの属性があるが、ここでは、色に関係しない以下の属性について表示例を示す。
| 属性 | 説明 |
| border | 枠線の太さを指定する。 |
| frame | 枠線を表示するかしないかを指定する。パラメータとしては、void、above、below、hsides、vsides、lhs、rhs、box、borderのいずれかを指定する。
|
| rules | テーブルの内側の線を表示するかどうか指定する。 |
| align | 表の表示位置を指定する。パラメータとしては、center, left, rightのいずれかである。 |
| cellpadding | 枠線とセルの内容との間隔を指定する。 |
| cellspacing | 内枠の太さを指定する。 |
| height | テーブルの高さを指定する。 |
| width | テーブルの幅を指定する。 |
表示例 (border)
<table>の属性を以下のように指定する。
<table border="n">
border="1"
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
|
border="5"
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
|
border="10"
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
|
表示例 (frame)
<table>の属性を以下のように指定する。
<table border="1" frame="frame">
|
|
above
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
|
below
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
|
hsides
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
|
vsides
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
|
|
|
|
border
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
|
|
表示例 (rules)
<table>の属性を以下のように指定する。
<table border="1" rules="rules">
表示例 (align)
<table>の属性を以下のように指定する。
<table border="1" align="align">
center
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
right
| 項目１ | 項目２ | 項目３ |
| 項目４ | 項目５ | 項目６ |
表示例 (cellpadding)
<table>の属性を以下のように指定する。
<table border="1" cellpadding="n">
表示例 (cellspacing)
<table>の属性を以下のように指定する。
<table border="1" cellspacing="n">
表示例 (height)
<table>の属性を以下のように指定する。
<table border="1" height="n">
表示例 (width)
<table>の属性を以下のように指定する。
<table border="1" width="n">
コメントする