HTMLでテーブル(表)を作るには

名簿やスケジュールなどのデータを表形式で表すときは、テーブルを使用するとよいです。

テーブルの基本構造

HTMLでテーブル(表)を挿入するには

table要素(表全体)、tr要素(行)、td要素(セル)、th要素(見出しセル)を用いて指定します。

 

例えば、次の5行×2列の表を作成するには・・・

イベント名 インターネット活用講座
日時 4月12日(金)10:30~12:00
内容 facebook、Twitter、ブログの活用
場所 リズ札幌
料金 〇〇〇円(教材費込み)

(ちなみに↑の講座は架空ですので)

 

<table>(テーブルタグ)を入れてあげて、

<table border=”1″>
<tr>
<th>イベント名</th><td>インターネット活用講座</td>
</tr>
<tr>
<th>日時</th><td>4月12日(金)10:30~12:00</td>
</tr>
<tr>
<th>内容</th><td>facebook、Twitter、ブログの活用</td>
</tr>
<tr>
<th>場所</th><td>リズ札幌</td>
</tr>
<tr>
<th>料金</th><td>〇〇〇円(教材費込み)</td>
</tr>
</table>

<th></th>や<td></td>の間の文字を変えればいいだけなのです。

※<th></th>は見出しセルデータという意味(Table Header)

※<td></td>はセルデータという意味(Table Data)

また、

<tr></tr>は「行」という意味があります。

trはtable+rowの頭文字の略ですね。

row(ロウ)は「」という意味です。(ちなみに、column(カラム)は「」です。)

どっちがで、どっちがかわからなくなる方は、

rowは「ロウ」・・・「ロウ」・・・「ロウ」・・・・・・「ギョウ」(行)・・・(笑)

と音が似ているので、そう身体で覚えるといいですね。

 

記事をシェアするShare on Tumblr0Tweet about this on TwitterShare on Google+0Share on Facebook0

コメントを残す

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

CAPTCHA