●「colspan=**」● 列をつなぎます。 行を増やすので heightの数値も増やします。 （１）現在の1行目の上に新しい行を作り、すべてつなぎます。 <table border=2 align=center width=300 height=250> <tr>　　　　←新しい１行目 <th width=300 colspan=6>　　　　←新しい１列目 <font size=5>時間割り表</font> </th> </tr> <tr bgcolor="#7777ff">　　　　←以前の１行目 <th width=50> ★ </th>　　　　←以前の１列目 <th width=50> 月 </th> <th width=50> 火 </th> ・・・ (中省略) ・・・ </table> 表示結果 時間割り表 ★ 月 火 水 木 金 １ 時 限 目 現 国 数 学 化 学 英 語 経 済 ２ 時 限 目 数 学 生 物 美 術 現 国 技 術 このやり方でもりっぱなタイトルになりますね。列が全部で 6列あり、またぎたい列数を指定します。 したがって、「colspan=6」となります。 （２）次は、3行目の月曜日から水曜日までつなぎます。 <table border=2 align=center width=300 height=220> <tr>　　　　←１行目 ・・・ (中省略) ・・・ </tr> <tr bgcolor="#7777ff">　　　　←2行目 ・・・ (中省略) ・・・ </tr> <tr bgcolor="#ffffaa">　　　　←3行目 <th>１<br>時<br>限<br>目</th> <td width=150 colspan=3>現<br>国</td> <!--- 火曜日の数学を消す　---> <!--- 水曜日の化学を消す　---> <td>英<br>語</td> <td>地<br>理</td> </tr> ・・・ (中省略) ・・・ </table> 表示結果 時間割り表 ★ 月 火 水 木 金 １ 時 限 目 現 国 英 語 経 済 ２ 時 限 目 数 学 生 物 美 術 現 国 技 術 あまり、時間割りでこういう表し方はしませんが、 列のつなぎ方として覚えましょう。又、 width=50と指定していた場合は、150 と直さないと、センターリングされないブラウザもあります。 ●「rowspan=**」● その列の行をつなぎます。 ここでは、 3時限目まで行を増やした物に先ほどのタイトルを 今度は横に付けます。 （１）左に列を増やしその行をすべてつなぎます。 <table border=2 align=center width=350 height=300> <tr bgcolor="#7777ff">　　　　←１行目 <th width=50 rowspan=4>　　　　←(1)新しい１列目 時<br>間<br>割<br>り </th> <th width=50> ★ </th>　　　　←(2)以前の１列目 <th width=50> 月 </th>　　　　←(3) <th width=50> 火 </th>　　　　←(4) <th width=50> 水 </th>　　　　←(5) <th width=50> 木 </th>　　　　←(6) <th width=50> 金 </th>　　　　←(7) </tr> ・・・ (中省略) ・・・ </table> 1行目は、7列になりましたが 2行目以降の 1列目は、1行目の1列目が rowspan=4の指定で使われているので、 2行目以降は、6列の指定をします。 これを覚えていれば、何処にでも行をつなげます。 表示結果 時 間 割 り 表 ★ 月 火 水 木 金 １ 時 限 目 現 国 数 学 化 学 保 体 経 済 ２ 時 限 目 数 学 生 物 美 術 保 体 技 術 ３ 時 限 目 音 楽 生 物 地 理 保 体 英 語 あまりセンスは良くありませんが我慢して見て下さい。(＾＾； 次は、同じ曜日の同じ科目をつなぎますョ！又、2行目以降は、6列の指定と言うのが 分かります。 （１）中間の行をつなぎます。 <table border=2 align=center width=300 height=220> ・・・ (中省略) ・・・ <tr bgcolor="#7777ff">　　　　← 2行目 <td width=50> １<br>時<br>限<br>目 </td>　←(1) <td width=50> 現<br>国 </td>　　　　←(2) <td width=50> 数<br>学 </td>　　　　←(3) <td width=50> 化<br>学 </td>　　　　←(4) <td width=50 rowspan=3> 保<br>体 </td >　　　　←(5) <td width=50> 経<br>済 </td>　　　　←(6) </tr> <tr bgcolor="#7777ff">　　　　← 3行目 <td width=50> ２<br>時<br>限<br>目 </td>　←(1) <td width=50> 数<br>学 </td>　　　　←(2) <td width=50 rowspan=2> 生<br>物 </td>　　　　←(3) <td width=50> 美<br>術 </td>　　　　←(4) <td width=50> 技<br>術 </td>　　　　←(5) </tr> <tr bgcolor="#7777ff">　　　　← 4行目 <td width=50> ３<br>時<br>限<br>目 </td>　←(1) <td width=50> 音<br>楽 </td>　　　　←(2) <td width=50> 地<br>理 </td>　　　　←(3) <td width=50> 英<br>語 </td>　　　　←(4) </tr> </tr> </table> ※ 「rowspan=**」が指定された次の行では、 列の指定が減っているのに注目！ 表示結果 時 間 割 り 表 ★ 月 火 水 木 金 １ 時 限 目 現 国 数 学 化 学 保 体 経 済 ２ 時 限 目 数 学 生 物 美 術 技 術 ３ 時 限 目 音 楽 地 理 英 語 行がつながった時の色にも注目！ 最初から観覧している人は分かっていると思いますが、 この 4行の色は、<tr>すなわち行単位のセルで指定しています。 何かが見えてきましたか？ 見えてきたと言う方がいれば幸いです。 何故、行のセルに色を指定する事にこだわって来たか..... ●「nowrap」● セル内の文字列を自動改行させない。 これは省略します。結果は表が「ビロ〜ン」と伸びてしまいます。 伸びなければ途中途切れてしまうのかな... 各自で試して下さい。 <table border=2 width=50> <tr> <td nowrap> これは省略します。結果は表が「ビロ〜ン」と伸びるか..... </td> </tr> </table> と、言いつつ見本を.... 「nowrap」の指定が無い場合 これは省略します。結果は表が「ビロ〜ン」と伸びるか..... 「nowrap」を指定した場合 これは省略します。結果は表が「ビロ〜ン」と伸びるか..... THE AND

<table>

<caption>

<tr>

<td>, <th>

次のPAGEは、画像関連タグです。