HTML テーブル ジェネレーター

HTMLテーブルジェネレーターは、データの行をHTMLマークアップに変換し、ブラウザーでデータをテーブルとしてレンダリングします。カンマ区切りまたはタブ区切りの値を貼り付け、テーブルの外観を選択し、ツールは完全な<table>要素を<thead>、<tbody>、テーブルの行とセルで書き込みます。 <tr>、<th>、<td>ごとに手入力し、列を整列させるためにセルを数えるのではなく、データを一度貼り付け、Webページ、電子メールテンプレート、またはドキュメントファイルにドロップする準備ができているバックアップマークアップをコピーします。

これは、テーブル HTML を手書きで書くことが反復的でエラーが発生しやすいために存在します。 10 行 5 列のテーブルには 50 個以上のセル タグが必要で、すべて正しく開閉され、1 つの欠落している </td> がレイアウトを壊します。アクセシビリティにより詳細が追加されます。ヘッダー セルはスコープ属性を持つ <th> である必要があり、スクリーン リーダーがそれらを発表します。テーブルにはその内容を説明する <caption> が必要になることがよくあります。このジェネレーターはそれらのルールを適用します。最初の行は適切なヘッダーになることができ、各行の最初の列は行ヘッダーになることができ、すべてのセル値は HTML エスケープされるため、ページを壊すのではなく < や & などの文字がテキストとして表示されます。

変換はクライアント側で実行されます 貼り付けたデータは解析され、ご自身のデバイスでJavaScriptで変換されるため、行は決してアップロードされません; 「生成」を押すと、スタイルモードのみを運ぶ使用記録がログに記録され、ページが読み込まれるとツールはネットワークを切断したまま動作し続けます スタイルの配信方法を選択できます: 一致するCSSブロックを持つ最新のクラス名、電子メールに貼り付けられても生き残る自己完結型のインラインスタイル、またはスタイリングがまったくないプレーンなセマンティックHTML ストライプの行、境界線、コンパクトなレイアウト、インデントのオプションにより、貼り付けているプロジェクトに出力を一致させることができます。

テーブル HTML ジェネレーターの作業例を次に示します。 `Plan,Price,Seats`,`Free,$0,1` and `Pro,"$1,200",10` の 3 行を貼り付け、キャプションとして Pricing を入力し、 Generate を押します。出力は <caption>Pricing</caption> の <table> で、3 つの <th scope="col"> ヘッダーと 2 つの本文行があり、引用された "$1,200" はカンマで分割するのではなく 1 つのセルのままです。 HTML メールのテーブル ジェネレーターとして使用され、スタイルをインライン スタイルに切り替え、すべてのセルに独自のパディングと境界線が表示されるため、スタイルシートは必要ありません。