没有空行的多行blockquote

时间:2016-05-11 20:37:59

标签: kramdown

这应该是非常容易的,但要么我没有正确阅读文档,要么Kramdown不支持这一点。我试图将命令行输出放在博客文章中,我想要使用blockquote。然而,kramdown坚持将同一行中的所有内容放在同一行中。

我可以在blockquote的每一行之间放置一个空格,但这不是输出的真实表示。如何创建块引用,但每行实际上位于单独的行上,每行之间没有空格。我想我正在寻找更多"预先格式化"输出,但我没有看到kramdown支持。

1 个答案:

答案 0 :(得分:1)

  

kramdown坚持将所有内容放在同一行的同一个区块中

这不是kramdown,这是HTML的正常行为。使用以下降价:

> One
> Two
> Three

kramdown将创建此HTML,所有行都分开:

<blockquote>
  <p>One
Two
Three</p>
</blockquote>

当您查看此内容时,浏览器会将所有空白行都折叠到一个空格中,因此它将全部显示在同一行:

  

一 二 三

最简单的解决方案是使用code block而不是块引用,使用缩进或这样的受防护代码块:

~~~
One
Two
Three
~~~

这将生成HTML:

<pre><code>One
Two
Three
</code></pre>

pre标记的默认样式将导致行分开:

One
Two
Three

如果你真的想在这里使用blockquote,有几种可能的解决方案。你可以在每一行的末尾添加两个空格来创建一个<br>元素来强制换行:

(这里我使用下划线来演示空格应该去哪里。你需要使用实际的空间才能工作。)

> One__
> Two__
> Three__

这将产生:

<blockquote>
  <p>One<br />
Two<br />
Three</p>
</blockquote>

另一种可能的解决方案是将适当的样式应用于blockquote。 Kramdown允许添加classid属性,因此您可以具体了解哪些块获得样式:

<style>
.cmd-line > p {
  white-space: pre;
}
</style>

Hello

{: .cmd-line }
> One
> Two
> Three

white-space: pre样式将导致源中的换行符出现在呈现的HTML中。