はじめに

htmlで表を作るやり方を以前教えていただいたのですが、今回はちょっと複雑な表の作り方を教えて欲しいのです。

どんな表ですか？

エクセルで言うところのセルが結合したようなテーブルなんですが、htmlで作ることはできますか？画像じゃないと無理ですか？

いいえ　htmlでもセルを結合したようなテーブルを作ることは可能です。colspanとrowspanを使用します。

ああ　htmlでも結合テーブルを作ることができるんですね。

サンプルと合わせてご紹介しましょう。

htmlで結合テーブルを作ろう

htmlでエクセルのセルを結合したようなテーブルを作りたいと思います。
この際、thやtdにcolspan,rowspanを設定します。colspanを設定すると横を何個分結合するか、rowspanでは、縦に何個結合するかを設定することができます。
サンプルでは、よくある結合テーブルの一例を使用します。

<table>
<tr><th colspan=2>福井をwebの力で発展させるweb制作会社</th></tr>
<tr><th rowspan=2>名前</th><td>ウィコネット</td></tr>
<tr><td>ホームページ制作会社</td></tr>
</table>

このようにサンプルコードを書きます。

結合テーブルのサンプル例

上記のようにちょっと複雑なテーブルも作ることができるようになります。
基本的な作り方は、基本的なテーブルの作り方でご確認ください。