如何在 GitHub README 中使用 Markdown 呈现多个列？

Posted 2023-02-19

【中文标题】如何在 GitHub README 中使用 Markdown 呈现多个列？

【英文标题】：How to render multiple columns with Markdown in GitHub README?

【发布时间】：2015-03-27 21:34:33

【问题描述】：

为了在三列中呈现项目，我尝试将以下 CSS3 指令添加到我的项目的 README.md 文件中，但样式被删除了：

<div style="-webkit-column-count: 3; -moz-column-count: 3; column-count: 3; -webkit-column-rule: 1px dotted #e0e0e0; -moz-column-rule: 1px dotted #e0e0e0; column-rule: 1px dotted #e0e0e0;">
    <div style="display: inline-block;">
        <!-- first column's content -->
    </div>
    <div style="display: inline-block;">
        <!-- second column's content -->
    </div>
    <div style="display: inline-block;">
        <!-- third column's content -->
    </div>
</div>

这种样式在 GitHub 处理 Markdown 之外可以正常工作。如何将数据放入 Markdown 文档的多个列中？请注意，我不关心对 IE 浏览器的支持，也不关心 IE 是否呈现单个列（无论如何，我的软件项目在 Windows 客户端上不起作用）。

【参考方案1】：

GitHub 风格的 Markdown only permits certain whitelisted tags and attributes in inline html:

HTML

您可以在自述文件、问题和拉取请求中使用 HTML 子集。

我们支持的标签和属性的完整列表可以在the README for github/markup 中找到。

关于<div> 标签，自述文件中说除了一般属性白名单之外，只有itemscope 和itemtype 属性被列入白名单：

abbr,accept,accept-charset,accesskey,action,align,alt,axis,border,cellpadding,cellpadding,@987654336 ,charoff,charset,checked,cite,clear,cols,colspan,color,compact,charset,charset,charset,@9876 987654351 @，enctype，for，frame，headers，height，hreflang，hspace，ismap，label，lang，longdesc，maxlength ,media,method,multiple,name,nohref,noshade,nowrap,prompt,readonly,rev,rev,rev,@9876 987654376 @，rules，scope，selected，shape，size，span，start，summary，tabindex，target，title，type 、usemap、valign、value、vspace、width、itemprop

没有标签支持style 属性。

除非你能用自述文件中列出的标签和属性破解某些东西，否则我想你会发现你不走运。

另一种方法是将GitHub Pages 站点放在一起，这似乎更加灵活。