HTML表作成ツール

表のマス目にセルを入力するか、表計算ソフトからCSVやTSVを貼り付けて読み込みます。見出しの行と列を選び、キャプションを付けてから、HTMLをコピーしてください。

無料 ブラウザで動作 2026年11月10日火曜日確認済み

このツールはブラウザ内で動作します。入力した内容が当社に送信されることはありません。

使い方

  1. マス目にセルを入力するか、CSVまたはTSVを貼り付け(任意)に貼り付けてから、表に読み込むを押してください。
  2. 最初の行を見出しにすると最初の列を見出しにするにチェックを入れ、見出しのセルを示します。
  3. 表が示す内容を書いたキャプションを入力してください。表に罫線が必要なら最小限のスタイルを追加するにチェックを入れます。
  4. HTMLの欄をコピーするか、ダウンロードを押して、マークアップをページに貼り付けてください。

見出しセルにscopeを付ける理由

見出しのセルはtd要素ではなくth要素です。scope属性は、そのセルがどのセルの見出しかを示します。列の上にある見出しはcol、行の先頭にある見出しはrowです。スクリーンリーダーは各データのセルを読むときにそれらの見出しを読み上げるため、表が見えない利用者にも数字の意味が伝わります。

キャプションは表全体の題名で、表の中で最初に置く要素です。「月別の売上」のように表が示す内容を書いてください。省略しないでください。HTML標準の表の項目(英語)に、これらの要素の説明があります。

列の上の見出し:scope=col付きのth;  行の先頭の見出し:scope=row付きのth;  データ:td

表計算ソフトからの貼り付けと文字のエスケープ

CSVの文字列は、セルをカンマ、セミコロン、タブで区切り、その文字を含むセルは二重引用符で囲みます。表計算ソフトからセルをコピーすると、たいていタブ区切りの文字列になります。小数点にカンマを使う言語の表計算ソフトは、セミコロン区切りのCSVファイルを保存することが多いです。自動判定は最初の行を読み、最も多く現れる区切り文字を選びます。

各セルの文字は、書き出す前にすべてエスケープされます。小なり記号やアンパサンドのような文字は文字参照に変わるため、ページでは文字として表示され、マークアップとして読まれることはありません。短い行には空のセルを足すため、どの行もセルの数がそろいます。

計算例:見出しの行と列がある2列の表

最初の行に「月」と「売上」、2行目に「1月」と「1200」のセルを置き、最初の行と最初の列を見出しにして、キャプションを「売上」とします。

表は、キャプション要素で始まり、その中身は「売上」です。続いて見出しの部分(thead)があり、2つの見出しセルがそれぞれscope=colを持ちます。その後に本体(tbody)が続き、「1月」は見出しセル(scope=row)、「1200」はデータのセルです。

よくある質問

scope属性は何をしますか?

支援技術に、どのセルの見出しかを伝えます。scopeがcolなら、見出しは列の上にあり、rowなら行の先頭にあるという意味です。scopeがないと、スクリーンリーダーは関係を推測しなければなりません。

見出しの列は、いつ使えばよいですか?

最初の列が、商品、人、月などの各行の名前になっているときに使います。行の名前がない数字だけの表には必要ないので、外してください。

表にキャプションが必要なのはなぜですか?

キャプションは、スクリーンリーダーがセルの前に読み上げる表の題名になります。目で見る利用者にも、表が何についてのものかをすぐに伝えます。表が単独で意味を持つときは、必ず書いてください。

表計算ソフトのデータには、どの区切り文字を選べばよいですか?

表計算ソフトからコピーした文字列にはタブを、小数点にカンマを使う言語で保存したCSVファイルにはセミコロンを選んでください。自動判定はほとんどの場合うまく動き、コピーする前にプレビューで結果を確認できます。

最小限のスタイルを付けると、ページの他の表も変わりますか?

はい。スタイルの要素はページのすべての表に効くため、そのまま貼り付けると影響します。ページがすでに表の見た目を整えている場合は外すか、必要な規則だけをコピーしてください。

入力または貼り付けた表は、どこかに送られますか?

いいえ。表、プレビュー、HTMLはお使いのブラウザの中で作られます。当サイトのサーバーに送られることも、保存されることもないため、ページを離れる前にHTMLをコピーするかダウンロードしてください。

出典

数値と文章の最終確認日:2026年11月10日火曜日。

当サイトの運営に必要なCookieを使用します。お客様の同意があれば、Googleは広告用Cookieを使い、パーソナライズ広告を表示します。拒否された場合も広告は表示されますが、パーソナライズはされません。