如何在 GitHub README 中使用 Markdown 呈现多列? [英] How to render multiple columns with Markdown in GitHub README?

问题描述

为了呈现三列中的项目，我尝试将以下 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;"><!-- 第一列的内容-->

<div style="display: inline-block;"><!-- 第二列的内容-->

<div style="display: inline-block;"><!-- 第三列的内容-->

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

解决方案

GitHub-Flavored Markdown 只允许内联 HTML 中的某些白名单标签和属性:

<块引用>

HTML

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

我们支持的标签和属性的完整列表可以在自述文件中找到github/标记.

关于<div>标签，README说除了通用属性外，只有itemscope和itemtype属性被列入白名单白名单:

<块引用>

abbr、accept、accept-charset、accesskey、action、align、alt、axis、border、cellpadding、cellspacing、char、charoff、charset、checked、cite、clear、cols、colspan、color、compact、coords、datetime、dir、disabled、enctype、for、frame、headers、height、hreflang、hspace、ismap、label、lang、longdesc、maxlength、media、方法、multiple、name、nohref、noshade、nowrap, prompt, readonly, rel,rev、rows、rowspan、rules、scope、selected、shape、size、span、start、summary、tabindex、target、title、type、usemap、valign, value, vspace, width, itemprop

没有标签支持 style 属性.

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

另一种方法是组合一个 GitHub Pages 站点，这似乎更加灵活.

To render items in three columns, I attempted to add the following CSS3 directives to my project's README.md file, but the styling was stripped out:

<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>

This styling works correctly outside of GitHub's processing of Markdown. How can I put data into multiple columns in a Markdown document? Note that I am not concerned about support for IE browsers and don't care if IE renders a single column (my software project does not work on Windows clients, anyway).

解决方案

GitHub-Flavored Markdown only permits certain whitelisted tags and attributes in inline HTML:

HTML

You can use a subset of HTML within your READMEs, issues, and pull requests.

A full list of our supported tags and attributes can be found in the README for github/markup.

Regarding <div> tags, that README says that only the itemscope and itemtype attributes are whitelisted, in addition to the general attribute whitelist:

abbr, accept, accept-charset, accesskey, action, align, alt, axis, border, cellpadding, cellspacing, char, charoff, charset, checked, cite, clear, cols, colspan, color, compact, coords, datetime, dir, disabled, enctype, for, frame, headers, height, hreflang, hspace, ismap, label, lang, longdesc, maxlength, media, method, multiple, name, nohref, noshade, nowrap, prompt, readonly, rel, rev, rows, rowspan, rules, scope, selected, shape, size, span, start, summary, tabindex, target, title, type, usemap, valign, value, vspace, width, itemprop

No tags support the style attribute.

Unless you can hack something together with the tags and attributes listed in that README I think you'll find that you're out of luck.

An alternative would be to put together a GitHub Pages site, which seems to be much more flexible.

这篇关于如何在 GitHub README 中使用 Markdown 呈现多列?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！