时间戳

首页 > 解决方案 > Pandoc Markdown 到 HTML 块引用样式

html - Pandoc Markdown 到 HTML 块引用样式

问题描述

我正在尝试找到一个很好的解决方案来在 Markdown 中编写我的电子邮件，并在 Thunderbird 中为一般消费设置样式。

我之前的解决方案，插件Markdown-here没有维护，并且不再适用于最新的 Thunderbird 版本。

我尝试取得成功的一种方法是使用 pandoc，并通过Insert->HTML.

例如：

电子邮件.md

Hi there, *this* is a **test** email written in `markdown`

pandoc 命令

pandoc email.md -t html -o email.html

电子邮件.html

<p>Hi there, <em>this</em> is a <strong>test</strong> email written in <code>markdown</code></p>

但是，格式并不总是我想要的。例如，在 Markdown-here 中，它曾经类似于 StackOverflow 的 blockquotes 渲染

块引用看起来像这样

但是，在我的 pandoc->Thunderbird 工作流程中，HTML 元素如下：

<blockquote>
<p>Blockquotes looks like this</p>
</blockquote>

呈现为缩进文本，如：

            块引用看起来像这样

这使我的电子邮件不太容易跟踪。

我读过 pandoc 有一个--css标志，您可以在其中定义要使用的 CSS 表，例如s --css=styling.css. 但是，我尝试过的任何方法似乎都不起作用。

有谁知道如何在 pandoc 中嵌入对生成的 HTML 的块引用样式的更改，以更紧密地遵循 StackOverflow 和 GitHub 的渲染降价样式？

标签： htmlcssmarkdownpandocthunderbird

解决方案

根据文档，您可以使用 flag 链接到 CSS 文件-c，我们可以查看 SO 的 blockquote 样式，即：

   blockquote p::before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    border-radius: 8px;
    background: #c8ccd0;
    }
blockquote{
    color:#535a60;
    padding:.8em .8em .8em 1em;
    position: relative;
}

因此，以这种风格运行以下内容应该可以满足您的需求。

pandoc -s -c <StyleFile>.css <Content>.md -o <Output>.html

推荐阅读