Markdown 表格宽度

方案一: div片段占宽

| 1 | 2<div style="width:200px"></div> |
|---| -------------------------------- |
| 3 | 4                                |

• 优点
  • 结构简单、通用性好
• 缺点
  • 只适合当某列宽度过窄时，避免不必要的换行而撑开
  • 宽度不是绝对的，只允许撑开不允许缩小 (缩小要修改所有其他列，很麻烦)
  • 只支持px
  • 与文字混合，当修改div所在位置的文字内容时，需重新修改大小

方案二: AnyBlock 的 width 处理器

[width(30,70)]

| 1 | 2 |
|---|---|
| 3 | 4 |

• 优点
  • 声明简单、清晰
  • AnyBlock 多种不同平台的插件，通用性较好
    (包括obsidian/codemirror/markdown-it/支持markdown-it的vuepress/vitepress等平台)
  • 支持百分比和px (默认百分比)

方案三: Markdown-it-attrs

与方案一非常类似，相较于方案一，由于其属性作用于td而非td内的div，所以弥补了一些缺点，改进点:

• 宽度是绝对的，允许撑开和缩小
• 不与文字混合，其属性作用于td元素。当修改属性所在位置的文字内容时，无需重新修改大小

方案四: Obsidian一些带宽度信息的表格插件

• obsidian-table-x: 这个是表格插件、允许拖拽
  • 优点: 半代码块形式，非代码块部分能跨平台正常显示
  • 缺点: 半代码块形式，代码块部分有些冗余
• Simple Columns: 这个另外说一下，不是表格插件，但其宽度可以被拖拽。可以借鉴成表格
  • 缺点: 完全是代码块形式的

方案五: 超宽表格的解决方案 (AnyBlock/BT)

我们想要调整表格的宽度，往往的一大原因是: 表格单元格内容过多过长，表格的整体宽度又过窄，导致单元格内容换行变得丑陋

所以往往这种思路通常也能代替控制表格宽度的需求

这里有几种方案:

全文取消缩窄栏宽

这个在 obsidian 里设置就行了。

不过往往缩窄栏宽效果不好，我们可能更希望正文是有宽度的，只希望个别内容溢出这个正文宽度。如果这样，见下面几种方法:

横向滚动

一是为表格添加溢出横向滚动的样式，而非自动换行

如果你不想全局添加样式，也可以使用 AnyBlock 的 addClass/addStyle 处理器为你想要的表格进行添加

AnyBlock 的超宽样式

(注意这个样式不是一个纯css样式，而是由js驱动的。即无法将该功能提取成简单的css片段，得用插件)

[addClass(ab-super-width)]

| 1 | 2 |
|---|---|
| 3 | 4 |

BlueTopaz主题/示例库

这里面也有小正文内使用超宽内容的方法，是纯css实现的。

原理是将正文div变宽，然后将每行/每段落对应的div变窄 (变回正常宽度)，而需要超宽的div则取消这个变窄的样式重新变宽