0

table(表組み)に関する要素を覚えよう

table(表組み)に関する要素を覚えよう

 

表組みを表す要素であるtable要素について解説していきます。
table要素は、表組みを表すものでありレイアウト目的での使用は禁止となりました。
table要素



 カテゴリー
フローコンテンツ
パルパブルコンテンツ
コンテンツモデル 次の順番で記述が可能です
1.caption要素(任意で1個)
2.colgroup要素(0個以上)
3.thead要素(任意で1個)
4.tfoot(任意で1個)
5.tbody要素(0個以上)またはtr要素(1個以上)
6.tfoot要素(任意で1個)ただしtfoot要素は合計1つまで

▼colgroupを使用してグループ分けの使用例

▼table要素に使用できる属性

 border  table要素がレイアウト目的で使用されていないことを明示的に表します。空文字か「1」のどちらかを指定可
 sortable   表組みが閲覧者によってソート(並び替え)可能であることを表します。
 グローバル属性  

tableを構成する要素

表組みは、表の大枠セルという、大きく3つの要素で形成されています。

 table要素  表組みの大枠を作りその中に構成する要素を配置します。
 tr要素   表の「行」を表します。
 td要素 表の「セル(データセル)」を表します。 
 th要素  表の「セル(見出しデータセル)」を表します。

簡単な使用例

 colgroup要素  表の列をグループ化する要素です

使用例(span属性を使用する場合)

使用例(col要素を使用しspan属性を使用する場合)

サンプルコード1

サンプルコード2

HTML

CSS

このように、table要素に関連付いて使用される要素が数多くあります。似たような名前も多いので間違えないように覚えておきましょう。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

mororeco > HTML > table(表組み)に関する要素を覚えよう