css - 标有 gfm: true 不使用适当的 css 呈现表格

Question

我有这些选项来配置我的marked对象，但表格没有用正确的 css 呈现。

{
        gfm: true,
        tables: true,
        breaks: false,
        pedantic: false,
        sanitize: false,
        smartLists: true,
        xhtml: false,
        smartypants: true,
        langPrefix: 'hljs language-',
        highlight(code) {
            return hljs.highlightAuto(code, ['html', 'javascript', 'java']).value;
        },
    }

有什么我想念的吗？min.css是否需要包含一个文件index.html才能完成这项工作并为表格提供适当的 css？

该表呈现如下：

对应的降价为：

| ID | Name| email |
|:----:|:----:|:----:|
| ... | ... | ... |
| ... | ... | ... |
| ... | ... | ... |

Answer 1

包含后问题得到解决gfm.min.css

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/pixelbrackets/gfm-stylesheet/dist/gfm.min.css" />

Answer 2

包含以下 CSS 将解决该问题。

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/pixelbrackets/gfm-stylesheet/dist/gfm.min.css" />

但它可能不是我们大多数人的最佳选择，因为它具有全球风格，会影响您的整个网站。

---

要克服此问题，请考虑从此处使用适当的 CSS：

• https://github.com/sindresorhus/github-markdown-css
• https://cdnjs.com/libraries/github-markdown-css

它将允许您仅将样式应用于具有markdown-body类的元素，而不是影响整个网站。