神器啊!一劳永逸的 Markdown 排版神器

作者: 王炳明 分类: 网站建设 发布时间: 2021-07-04 21:44 热度:2,120

大家好,我是明哥。

今天来跟大家分享一个排版神器,在此之前我先介绍一下目前的写作的平台。主要有:

我目前的写作的平台主要有:

  1. 本地:使用的Typora
  2. 个人网站:https://iswbm.com
  3. 公众号

这三者的都是可以直接或间接地使用 Markdown 进行文章的编排,避免我花大量的时间精力在排版上面。

但是不同的平台使用是使用不同的 Markdown 渲染主题,让我这个强迫症患者不舒服了大半年。

于是前两天,我就花了一晚上,把它们给统一了一下,明哥感觉这个主题非常不错,于是特地来给大家分享一下

之前的排版

本地写作工具,我使用的是 Typora,它内置了不少 Markdown 的主题,都还挺不错的,不过缺点就是用久了之后容易审美疲劳,导致我很久之前就用回了默认的主题,简洁舒服,但是颜值不高。

公众号的排版,我使用的是 md2all,把 markdown 往上一帖,就排版好了,简直不要太方便。

在 MD 排版界,还有一个新起之秀,MDNice,目前的用户非常多,使用体验相对 md2all 确实好了不少,至少不会时不时的打不开。

但我个人还是挺少用 mdnice,只有在 md2all 打不开的时候,临时应急一下,总结一下,主要有两点原因:

  1. mdnice 没有之前那么纯粹了,好像要做社区,要排版的话需要有帐号、微信登陆
  2. mdnice 的主题比较花哨,不是我喜欢的风格,曾尝试把 md2all 的修改过的css搬过去,效果不甚理想,遂弃

个人网站的 Markdown 样式,最开始使用的默认主题,后来参考 mdnice 的样式修改过一版,渲染效果还是比较满意的。非常遗憾,之前的 css 样式没有备份,所以这里也没能截到之前的排版给大家看。

Typora 的排版

一直比较喜欢少数派的排版,搜索意外得知,少数派也是使用的 Markdown 进行排版的,于是从网上找到了有人复刻了他们的排版的 CSS 样式,根据自己的喜欢的网格再加以调整,最终得到了自己的排版样式。

但这份样式,对于不同的平台,需要特别的适配微调,最终才能渲染到位。

下边给大家展示一下渲染的效果

一级标题 + 行内代码块 + 标准代码块

代码分为短代码和代码块,代码字体采用 JetbrainsMono,主题采用 Jetbrains 的 Darcula ,熟悉的感觉又回来了,有木有?

神器啊!一劳永逸的 Markdown 排版神器

一级标题 + 表格 + 加粗 + 代码

边框选的红色,与整体的配色协调一致

神器啊!一劳永逸的 Markdown 排版神器

二级标题 + 有序/无序列表 + 加粗 + 引用 + 链接 + 代码

引用还是沿用之前在 md2all 上的样式

神器啊!一劳永逸的 Markdown 排版神器

个人网站的排版

个人网站的排版与上面的排版风格一致,这里直接给出个截图,有兴趣的直接去网站(https://iswbm.com) 体验。

神器啊!一劳永逸的 Markdown 排版神器

另外贴图的话,如果不加任何处理的话,有的很难看出这是一张贴图,因为我在 CSS 中设置了图片自动附加阴影的效果,例子可以看上面几张截图。

至于公众号的排版,就是你现在所看到的这样的效果,我就不再截图了。

要改这个样式,其实也挺简单的,只要稍微学一下 CSS,就可以对一些好看的模板进行微调,甚至可以从多个主题里 ,取其精华,去其糟粕,整合成你期望的样式。

但如果你要进行深度的定制,那么就要去系统的学习一下 CSS 了,对于我这个非前端程序员来说,成本显然有点大。

好了,明哥今天的分享就到这边,以后的公众号的文章会一直使用这套排版,最后请大家评价这套排版,打个分。

文章有帮助,请作者喝杯咖啡?

发表评论