HTML 表格生成器

手写表格标记——每一个 <tr>、<th>、<td>，外加转义——既慢又容易出错。粘贴 CSV 或从 Excel、Google 表格复制的单元格（或从一个空网格开始），就能得到整洁且无障碍的 HTML：<caption>、<thead> 和 <tbody>、带 scope 以便屏幕阅读器朗读的表头单元格、已转义的文本，以及右对齐的数字列。你可以选择现成的样式（<style> 块）、适用于邮件通讯的内联样式，或者只给出类名以配合你自己的 CSS。

使用方法

1. 粘贴 CSV、TSV 或电子表格单元格——或保持输入框为空，并设置行数和列数。
2. 指定第一行和第一列是否为表头。
3. 添加标题。
4. 选择样式：<style> 块、用于邮件的内联样式，或仅类名；再选择外观。
5. 复制 HTML。

计算公式

<table> → <caption> → <thead><tr><th scope="col"> → <tbody><tr><th scope="row"> / <td>

表头单元格带有 scope="col"（列表头）或 scope="row"（每个正文行的第一个单元格），把数据单元格与其表头关联起来，方便辅助技术使用。文本会被转义，所以 < 和 & 等字符会按字面显示。所有单元格都是数字的列（允许千位分隔符、货币符号或 %）会使用等宽数字并右对齐。内联模式会把样式写在每个单元格上，这正是邮件客户端所需要的。

示例

示例价格数据会生成一个表格：标题为“套餐与价格”，表头行为 套餐 / 价格 / 存储空间 / 用户数，另有三行正文，每行的第一个单元格（免费版、团队版、商业版）是行表头。价格（$0、$12、$29）全是数字，所以右对齐；用户数则不是，因为“不限”是文本。斑马纹外观会加入一个 <style> 块，给每隔一行的行加上底色。