行やセルを追加するには、<tr>や<td>を追加入力する必要があります。
まずは先ほど作成した表に、「三時間目、社会」を追加してみましょう。
[追加するHTML] <tr>
<td>三時間目</td>
<td>社会</td>
</tr>
行が1つ必要ですから、<tr>を1つ追加します。
さらに、「三時間目」を入力するセルと「社会」を入力するセル、合計2つのセルが必要なので<td>を2つ追加します。
<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
<title>表の作成</title>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<table class="tableborder">
<tr>
<td>一時間目</td>
<td>国語</td>
</tr>
<tr>
<td>二時間目</td>
<td>数学</td>
</tr>
<tr>
<td>三時間目</td>
<td>社会</td>
</tr>
</table>
入力が完了したら、ブラウザで確認してみましょう。
[ブラウザでの表示例]
成功していれば、三行目と入力したテキストが表示されると思います。
講師名の追加
ついでに、教科の横に講師の名前も追加してみましょう。
国語の講師名、数学の講師名、社会の講師名を追加します。
この場合は行は追加する必要はありませんので、<td>のみを書き加えます。
<!DOCTYPE HTML>
<html lang="ja">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
<title>表の作成</title>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<table class="tableborder">
<tr>
<td>一時間目</td>
<td>国語</td>
<td>西田</td>
</tr>
<tr>
<td>二時間目</td>
<td>数学</td>
<td>入部</td>
</tr>
<tr>
<td>三時間目</td>
<td>社会</td>
<td>野田</td>
</tr>
</table>
入力が完了したら、ブラウザで確認してみましょう。
[ブラウザでの表示例]
なんとなく表っぽくなってきましたね！いい感じです！
次のページでは、この表に見出し行を追加してみましょう！
覚えておきたいポイント
表の構成に気をつけよう
基本的に<tr>と<td>は何個でも増やすことができます。
ただし、互いに整合性を取らないと表として機能しなくなったり、レイアウト崩れの原因となります。
