我在GitHub页面上使用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>

最佳答案

不,您不能简单地添加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文件中,并在此处将溢出设置为隐藏。

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


这是只为选定表设置溢出的明确方法。

关于markdown - 有没有一种方法可以使用HTML溢出Markdown表?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/41076390/

10-14 13:13
查看更多