本文因为知识含量低，并不尝试进行任何教学，只是一个解决问题的过程和思路复盘。

我在使用小宇宙 app 的时候，出于做了多年新媒体的职业敏感，发觉那些优秀的播客节目，除了在最重要的音频质量上下足功夫外，也没有放过单集的 show notes 等细节。

(资料图片仅供参考)

然而，小宇宙的编辑器说实在的，很朴实，只有最基本的功能，包括只能用二级标题做更高一级的大标题、引用、列表、粗体、斜体、添加链接和图片，以及添加时间点。

虽然这样可以让大部分的播客 show notes 保持统一的简洁，但也确实让人很难大展拳脚。

不过，让我动了研究一下这个编辑器的主要原因，还是它那固定的行间距。如果我没有使用引用或列表格式，通常情况下，在撰写单集的时间点时，界面真的会很丑。

然而我却发现，不止一个播客在这一点能够做到无视行间距的存在。

我也想要，所以我开始想办法解决这个行间距的问题。

1 求助搜索引擎

如果别人能够实现这个需求，或许他们也是在网上看到的经验分享，就像你第一次想要排版一个好看的微信公众号版面，在搜索引擎一搜，就会有无数人分享经验来教你。

至少作为一个自食其力自给自足的 I 人，我是这么想的。

可惜，搜索引擎并帮不到我，就连比搜索引擎还万能的小红书都没有任何相关的帖子。

2 求人不如求己

虽然没有找到方法，但是我相信，那么多人能做到的，那我也一定可以。

在小宇宙更新一档播客节目，有两个途径，一个是通过 RSS 订阅链接进行同步更新，另一个就是直接上传音频到小宇宙的服务器。

通过 RSS 订阅链接进行更新的运营者，可能可以从源头上解决这个问题，但像我这种没有搞服务器的，只能尝试钻研一下小宇宙的编辑器了。

由于之前刚学习了如何用 HTML 和 CSS 给 Obsidian 改界面，而且微信公众号第三方编辑器也是用 HTML 的原理进行美化排版，所以我第一步就是想到了用 HTML 来试试这个方法是否也能套用到小宇宙的编辑器上。

所以，我就先在播客单集 show notes 找一个间隙，添加了一个代表空行的<br>在中间，并进行更新。

在审核通过了之后，我发现，原本写着<br>的地方，确实变成了一个空行，而不是「<br>」这段字符，这说明，在小宇宙编辑器上书写 HTML 确实是可行的。

3 实践

使原本单调乏味的 HTML 变得更美观，通常是经过 CSS 进行设定，有三种方法，内联样式、内部样式和外联样式。

我之前在 Obsidian 上修改外观，使用的就是直接修改外部 CSS 文件，也就是所谓的「外部样式表」方法——先在 CSS 文件中对样式进行了定义，HTML 再直接根据这个定义对页面外观进行设置。

但是，我并无法通过编辑器修改到小宇宙的 CSS 文件，所以我只能通过「内联样式」对 HTML 进行修改，并且内联样式的设定优先级也是三者中最高的，可以无视外部 CSS 文件的设定。

那么，我首先尝试直接修改行间距，也就是——

无效。

我打开 Chrome 开发者工具，发现自己犯了一个很想当然的错误。

原来我看到的行间距，并不是通过 line-height 行间距设置的，而是小宇宙设置了每段文字有 20 像素的 margin-bottom，换句话说就是每一段文字下方固定有 20 像素的空白，形成了行间距的假象。

而且每一段文字是用的 div 标签，而不是 p 标签。

清楚了这个设置之后，我再次尝试——

失败。

我再定睛一看，发现原来小宇宙是给这些 div 块加了名为「paragraph」的 class 属性，再在样式中设定「paragraph」的 margin-bottom 值为 20 像素。

尽管说内联样式的优先级是最高的，但我直接在小宇宙编辑器上书写，也只不过是在原有的 div 块上添加一个新 div 块，并定义这个新块的 margin-bottom 值为 0 像素。

也就是说，不管我怎么修改新 div 块的 margin-bottom，都不影响原 div 块的 20px 下边缘，原本该在的 20 像素空白边还是会在。

而我并没办法使用内联样式修改「paragraph」的 CSS 值，至少目前我的了解是这样的。

就在我多次尝试，每次尝试都要等待一次漫长的审核，实在是受不了之后，我突然灵光一动，把已经实现了我想要的效果的 show notes 页面，复制链接到网页端打开，再用开发者工具查看。

结果发现，实际上并没有那么复杂。

我在用小宇宙编辑器撰写 show notes 时，每次换行都是直接用回车键，导致生成的每一段文字都是一个 div 块或 p 块，而块与块之间就会默认有 20 像素的行间距。

而别人是如何做到没有行间距的呢？

答案就是，不要换行，把文字都放在同一个块里。

换句话说，我那些分好的行，每行就是一个块，每个块之间就会有 20 像素的间隔，但是别人因为不换行，所有文字只在一个块里，这个块还是有 20 像素的间隔。这 20 像素的间隔不作用在块里面的文字里，而是起到跟下一个块的分界作用。

至于为什么在手机端看到的 show notes 页面时，又是分好行的样子呢？

原来，诀窍就藏在我最开始测试是否能使用 HTML 的 <br> 里。

每行文字分段的时候，不要用回车键手动换行，而是使用 <br>，让编辑器识别到 <br> 后自动换行。

测试，成功。

页面终于变成了我想要的样子，不过，还有一个问题，就是如果通过小宇宙的 RSS 链接托管到其他播客平台，而那些平台的 show notes 却并不支持 HTML，比如苹果播客，就会出现下面这种状况。

所以这只能当一个临时的解决办法，可能最终要让 show notes 变得好看、容易阅读，还是得弄个服务器。

那么，有机会我们再解决这个问题吧。