rowspanとは？初心者にも分かる表の結合の基本と使い方共起語・同意語・対義語も併せて解説！

この記事を書いた人

高岡智則

年齢：33歳性別：男性職業：Webディレクター（兼ライティング・SNS運用担当）居住地：東京都杉並区・永福町の1LDKマンション出身地：神奈川県川崎市身長：176cm 体系：細身〜普通（最近ちょっとお腹が気になる）血液型：A型誕生日：1992年11月20日最終学歴：明治大学・情報コミュニケーション学部卒通勤：京王井の頭線で渋谷まで（通勤20分）家族構成：一人暮らし、実家には両親と2歳下の妹恋愛事情：独身。彼女は2年いない（本人は「忙しいだけ」と言い張る）

rowspanとは？

rowspan は HTML の表（テーブル）における縦方向のセル結合を表す属性です。列の中で同じ意味のセルが連続する場合に、1つのセルを上下にまたいで表示させることができます。これにより、表の幅をすっきりさせたり、データの関連性を強調したりすることができます。

例えば、左の列に「カテゴリ」という見出しがあり、同じカテゴリが複数の行で使われるときに rowspan を使うと、1つのセルが上から下へ連続して表示されます。rowspan は縦方向の結合を行うため、表の見た目が読みやすく整理されます。

一方で、横方向の結合には colspan という別の属性を使います。rowspan と colspan を適切に使い分けることで、表を見やすく、情報を正しく伝えることができます。

基本の使い方

基本は td 要素に対して使用します。値には結合させたい行数を整数で指定します。たとえば rowspan='2' と書くと、そのセルは以下の1行分と合わせて2行分の高さになります。ここでは単純な例として、左の列のセルを 2 行にまたがらせてみます。

果物	リンゴ	赤
果物	バナナ	黄
飲み物	水	透明

この例では左の「果物」セルが縦に 2 行にまたがり、2 行分の高さを占めています。つまり、2 行分のデータを1つのセルでまとめることができるのです。

よくある使い方とコツ

見出しやカテゴリが複数行にまたがる場合に rowspan を使うと、繰り返しを減らして表をすっきり見せられます。重要なポイントは次の2つです。
1) rowspan の値は結合させたい行数を表す整数です。
2) rowspan を使うと、結合されたセルの下の行のセル配置が崩れないよう、表全体の構造をよく考える必要があります。

初心者が陥りがちなミスとして、 rowspan を指定した後に他の行のセル数が揃わなくなるケースがあります。こうした場合は、各行の列数を見直して、結合後のセル数が表全体で揃うように調整しましょう。表の設計段階で計画を立てることが、後で修正しやすくするコツです。

まとめ

rowspan は縦方向のセル結合を可能にする強力な属性です。使い方は td に rowspan='N' を設定するだけで、N 行分の高さを1つのセルが占めるようになります。実際の場面としては、カテゴリ名や見出しが複数行にわたる場合に活躍します。この機能を上手に使えば、表の読みやすさと美しさを大きく向上させることができます。

rowspanの関連サジェスト解説

html rowspan とは

html rowspan とは、HTMLの表（table）を作るときに使う属性の一つです。td要素や th要素に rowspan 属性をつけると、そのセルが縦方向に複数の行にまたがって表示されます。たとえば rowspan=\"2\" と書くと、そのセルは下の行と結合して1つのセルとして表示され、2行分の高さを占めます。これを使うと、データの見え方を整理でき、表の列の意味を重複させずに示せます。使い方のコツは、行を追加したときに空白になるセルを作らないよう、他のセルの数と結合の数を合わせることです。ただし rowspan を使うときは、表の構造が少し複雑になることがあり、HTMLが正しく解釈されず崩れる場合があります。実際の場面では、必要な箇所だけに rowspan を適用し、他の行には対応するセルを用意して整えると安心です。例として、以下のようなHTMLを参考にしてください：

田中	国語
数学
佐藤	英語

このようにすると、田中さんの名前が2行にまたがり、科目名だけが2行目以降のセルとして表示されます。もしセルの結合を使わずに済ませたい場合は、代わりにCSSや別の表構造を検討するとよいでしょう。

rowspanの同意語

行結合: セルを縦方向に複数の行にまたがらせる属性。テーブルの表示で、1つのセルが2行分などを占めるようにする機能です。
行跨ぎ: セルが縦方向に複数の行をまたぐことを表す言い換え。rowspan の別名として使われることがあります。
複数行にまたがるセル: セルが縦方向に複数の行を跨いで表示される状態を指す表現です。
縦方向の結合: セルを縦方向に結合して表示を跨がせる機能を指す言い方です。
セルの行結合属性: HTML の rowspan 属性と同じ意味を持つ、セルの行を結合する性質を表す名前です。
行のスパン属性: スパン(span)を使って行を跨ぐ性質を指す表現。rowspan と同義の説明として使われます。
行をまたぐセル: セルが複数の行にまたがって表示される状態を示す言い換えです。

rowspanの対義語・反対語

rowspanなし: rowspan属性を使わず、セルが1行だけを占有する状態。つまり縦方向にセルを結合しない、各セルが独立して表示される状態です。
rowspan=1: rowspan属性を1に設定して、縦方向の結合を実質的に行わない状態。複数行にまたがる結合を避けたいときの指定です。
縦方向の結合を解除: すでにrowspanで結合されているセルの結合を解く、または結合を行わない設定にすること。
縦方向の結合を行わない状態: 縦方向に跨るセル結合を適用していない、個別のセルとして表示される状態。
横方向の結合(colspan): 対照的な概念として挙げられることが多い。セルを横方向に結ぶ colspan は、縦方向の rowspan の反対の操作として感覚的に用いられます。