Markdown插入表格

默认表格

表头内容默认居中对齐,单元格内容默认左对齐,Markdown 代码:

| 标题1 | 标题2 | 标题3 |
| ------ | ------ | ------ |
| 文本好短 | 文本不短也不长 | 文本好长文本好长文本好长 |
| 文本好长文本好长文本好长 | 文本好短 | 文本不短也不长 |

显示效果:

标题1 标题2 标题2
文本好短 文本不短也不长 文本好长文本好长文本好长
文本好长文本好长文本好长 文本好短 文本不短也不长

带有对齐格式的表格

居左对齐,居中对齐,居右对齐,Markdown 代码:

| 标题1 | 标题2 | 标题2 |
| :------ | :------: | ------: |
| 文本好短 | 文本不短也不长 | 文本好长文本好长文本好长 |
| 文本好长文本好长文本好长 | 文本好短 | 文本不短也不长 |

显示效果:

标题1 标题2 标题2
文本好短 文本不短也不长 文本好长文本好长文本好长
文本好长文本好长文本好长 文本好短 文本不短也不长

Markdown关于表格的语法

  • 默认标题居中对齐,内容居左对齐
  • :-内容和标题栏居左对齐,:-:内容和标题栏居中对齐,-:内容和标题栏居右对齐
  • | - :之间多余的空格会被忽略,-的数量至少一个
  • 内容和|之间多余的空格会被忽略

通过html的table标签插入表格

html写法

<table>
  <tr>
    <th>标题1</th>
    <th>标题2</th>
    <th>标题3</th>
  </tr>
  <tr>
    <td>文本好短</td>
    <td>文本不短也不长</td>
    <td>文本好长文本好长文本好长</td>
  </tr>
  <tr>
    <td>文本好长文本好长文本好长</td>
    <td>文本好短</td>
    <td>文本不短也不长</td>
  </tr>
</table>

这种方式,表格上方会留出大量空白

解决表格上方留出空白的办法

1.压缩表格

<table><tr><th>标题1</th><th>标题2</th><th>标题3</th></tr><tr><td>文本好短</td><td>文本不短也不长</td><td>文本好长文本好长文本好长</td></tr><tr><td>文本好长文本好长文本好长</td><td>文本好短</td><td>文本不短也不长</td></tr></table>

2.表格首部和尾部用如下字符串包裹

{% raw %} table {% endraw %}

两种方式对比

  • markdown的语法写起来比较直观,用 | 分割表格,当表格内容比较少时适合用这种方法
  • 当从页面拷贝的table内容比较多时,更适合用后面这种方式,可以省去转换的步骤