有没有一种使用HTML来溢出Markdown表格的方法？

Question

有没有一种使用HTML来溢出Markdown表格的方法？

3

我在GitHub Pages上使用jekyll搭建了一个博客。我的一篇文章（用markdown写的）包含一个表格，在智能手机上会溢出，导致整个页面都出现了水平滚动条。

我想知道是否有一种方法可以像下面这样编写HTML+markdown，使div溢出而不是整个页面。

<div style="overflow-x: scroll;">

    |                        |ODBC | SSMS | SQLCMD | ISQL|
    |---                     |:---:|:---: |:---:   |:---:|
    |ANSI_NULL_DFLT_ON       | ON  | ON   | ON     | OFF |
    |ANSI_NULLS              | ON  | ON   | ON     | OFF |

</div>

- Zack Stone

你能提供一个仓库的URL吗？ - David Jacquel

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- deveth0 · Accepted Answer

不，你不能简单地添加一个HTML包装器，但你有其他几个选项。

如果你正在使用Kramdown Markdown引擎，只需添加以下代码片段的包装器（请注意div标签和markdown块之间的空行。这是必需的）。

<div class="table-wrapper" markdown="block">

|                        |ODBC | SSMS | SQLCMD | ISQL|
|---                     |:---:|:---: |:---:   |:---:|
|ANSI_NULL_DFLT_ON       | ON  | ON   | ON     | OFF |
|ANSI_NULLS              | ON  | ON   | ON     | OFF |

</div>

您可以将CSS规则添加到您的Sass / CSS文件中，并在此处设置overflow hidden。

.table-wrapper {
  overflow-x: scroll;
}

这是一种清晰的方式，只为选定的表设置溢出。