table要素・tableタグとは

<table></table>

tableタグ。テーブル(表)を表示する。テーブル表示には以下の要素と関連を持つ。

  • caption
  • thead
  • tfoot
  • tbody
  • colgroup
  • col
  • tr
  • th
  • td

table要素は0または1つのcaption要素を含むことができる。

テーブルの行はthead、tfoot、またはtbody要素により、ヘッダグループ、フッタグループ、本体グループにグループ化することができる。

テーブルの列はcolgroupまたはcol要素によりグループ化することができる。テーブル定義の先頭に記述する。

テーブルのセルはth要素による「見出し」、またはtd要素による「データ」情報のどちらかを含むことができる。セルは複数行、複数列に渡って表示されることが可能である。

HTML
<table border="1">
<caption>国語と算数の成績について</caption>
<tr>
  <th rowspan="2"></th><th colspan="2">個別平均</th><th rowspan="2">全体平均</th>
</tr>
<tr>
  <th>国語</th><th>算数</th>
</tr>
<tr>
  <th>男子</th><td>81</td><td>75</td><td>78</td>
</tr>
<tr>
  <th>女子</th><td>84</td><td>78</td><td>81</td>
</tr>
</table>

ブラウザでの表示例

テーブルの表示例

attribute(属性)について

summary = text
テーブルの要約を記述する。

width = length
テーブルの横幅を指定する

border = pixels
テーブルの境界線幅を指定する

frame = void|above|below|hsides|lhs|rhs|vsides|box|border
表を囲む枠において、表示させる場所を指定する

  • void: 外枠無し。デフォルト値である。
  • above: 上端だけ表示
  • below: 下端だけ表示
  • hsides: 上端・上端を表示
  • vsides: 左右両側を表示
  • lhs: 左側だけ表示
  • rhs: 右側だけ表示
  • box: 四辺を表示
  • border: 四辺を表示

rules = none|groups|rows|cols|all
行と列の間の罫線に関する情報を指定する。

  • none: 罫線なし。デフォルト値である。
  • groups: 罫線は行グループ(thead/tfoot/tbody)、または列グループ(colgroup/col)の間に表示される。
  • rows: 罫線は行間のみ表示される。
  • cols: 罫線は列間のみ表示される。
  • all: 罫線は全ての行間・列間に表示される。

cellspacing = length
外枠とセルの距離を指定するcellpadding = lengthセルの枠線とセルの内容の距離を指定する。

コメントを残す

メールアドレスが公開されることはありません。