Kindle 显示源代码，每行后有空行

【问题标题】：Kindle displays source code with blank lines after each lineKindle 显示源代码，每行后有空行
【发布时间】：2022-10-13 01:08:44
【问题描述】：

我在 Markdown 中有以下文本：

```
# Testing
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. 

```java
for (int i = 0; i < 10; i++) {
    System.out.println("hello world");
}
```

然后我使用 Pandoc 将此文件转换为 epub。当我在像 Calibre 这样的桌面阅读器中检查这个文件时，它看起来不错：

但是，Kindle 会在源代码的每一行之后以空行显示源代码。

我该如何设置它的样式，以便它不会在 Kindle 上显示这些空行？

【问题讨论】：

标签： pandoc epub kindle

【解决方案1】：

在检查了 Pandoc 生成的 epub 的 XHTML 后，我找到了解决此问题的方法。简化后，Pandoc 从源代码块创建以下结构：

<div class="sourceCode">
  <pre class="sourceCode">
    <code class="sourceCode">
      <span>for (int i = 0; i < 10; i++) {</span>
      <span>    System.out.println("hello world");</span>
      <span>}</span>
    </code>
  </pre>
</div>

对于用于每行代码的<span> 元素，以下样式语句会导致上述问题：

pre > code.sourceCode > span { display: inline-block; line-height: 1.25; }

可以通过以下方式在书籍的自定义 CSS 中覆盖此样式来解决此问题：

pre > code.sourceCode > span { display: inline; }

【讨论】：