チェックフィールド株式会社

東京 港区 千代田区 中央区 ITの運用管理やコンサルティング・相談・サポートはITコンシェルジュにお任せください

スタッフぶろぐ

このエントリをはてなブックマークに登録

I初心者にやさしいHTML講座:テーブルを使って表を作ってみよう

今回はテーブルを使って表を作成する方法をご紹介します。

<table>タグで全体の枠を作り、<tr><td><th>タグを使って中身を配置していきます。

<table>
表の大枠を示す要素です。表の大きさや罫線などは、この要素の属性で設定することになります。

<tr>
表の行を示す要素です。
例えば、3行の表を作成する場合は、この要素を3つ配置することになります。

<td>
表のセル(データセル)を示す要素です。
例えば、横に3つのセルを並べたい場合は、各行(tr要素)の中にこの要素を3つ配置します。

<th>
表のセル(項目名のセル)を示す要素です。
td要素の代わりにこの要素を使用すると、そのセルが項目として扱われます。
一般的なブラウザでは、この要素内の文字列は太字になります。

<table>
 <tr>
  <th>項目1</th>
  <th>項目2</th>
  <th>項目3</th>
 </tr>
 <tr>
  <td>(左中段)</td>
  <td>(中央中段)</td>
  <td>(右中段)</td>
 </tr>
 <tr>
  <td>(左下段)</td>
  <td>(中央下段)</td>
  <td>(右下段)</td>
 </tr>
</table>

出力結果

項目1 項目2 項目3
(左中段) (中央中段) (右中段)
(左下段) (中央下段) (右下段)

 

▼詳細はこちらからもご覧になれます。
http://www.htmq.com/html/table.shtml

エクセルのような表を作る際にはぜひお勧めです。