好吧，这篇文章纯粹是改完主题之后又不知该写什么之后的一篇水文。。

我呢，在2020年12月左右，偶然见识了现在用的Markdown编辑器——Typora。

当时我去学廖雪峰老师的Git教程，在评论区看见了一条消息，也许是广告吧，说Typora是个不错的Md编辑器，我便去官网下载了一个试试看。

见识了之后，我就没用过其他的编辑器写Md。

它的优点，本人认为有以下几点：

  • UI美观、高端、大气、上档次。
  • Markdown语法支持较为全面。
  • 相较于Sublime、VS Code、HBuilder X等兼任Markdown与其它语言的编辑器，Typora这种专业Markdown编辑器在Markdown做出的适配明显优于这些竞争者。
  • Typora是一个所见即所得的Markdown编辑器。虽然它没有预览窗格，但它是所见即所得类型的，同时它又兼具源码模式，这样使我们不必打开预览窗格预览，而是边写边预览，同时还为我们带来了更大的书写空间。
  • 是它带领着我进入了正式写Markdown的氛围（之前我一直都是用html写md hhhc）

然后，经过对比各个主题，我最终选择了自带的Night主题（怪不得说是“美化的终点是原生” “自带最美”）

但即便选择了Night主题，我还是对Night主题略有不满：

  • 分割线颜色太弱，高度太薄；
  • 引用的左斜杠颜色太弱，宽度太细；
  • 链接的下衬线颜色与文字无明显区别，看起来略不美观；
  • 代码高亮对于习惯VS Code了的我看来极不和谐。

于是，围绕这些缺点，我便开始改进。

打开Typora的主题文件夹，打开night.css。

首先，针对分割线这一方面。

分割线在HTML里的标签是<hr>，我就按下Ctrl+F，输入hr，很快找到了这一截：

hr {
    height: 2px;
    border: 0;
    margin: 24px 0 !important;
}

height就是高度。

于是，，太薄，那就加厚！

我调整到了4px，发现又太厚了，就调到了3px，正好！

在是分割线的颜色。

这一段没有关于color的，那就下一项hr！

终于，又到了这一段：

hr {
    background: #474d54;
    /* variable */
}

既然是太暗了，那就往白色那边调！

我调的是 #adadad 。

分割线解决了，下一个，引用！

引用在html里是blockquote，继续查找它！

上来就看到了！

blockquote {
    padding-left: 1.875rem;
    margin: 0 0 1.875rem 1.875rem;
    border-left: solid 2px #474d54;
    padding-left: 30px;
    margin-top: 35px;
}

这个左斜杠目前有两个怀疑对象：第四和第五行。

咱再来分析：那个斜杠有颜色，找有颜色的！

那就是第四行！

太细了？调宽！

太暗了？调亮！

我是把这段改成了这样：

blockquote {
    padding-left: 1.875rem;
    margin: 0 0 1.875rem 1.875rem;
    border-left: solid 5px #b8babd;
    padding-left: 30px;
    margin-top: 35px;
}

就很ok。

下一个问题：超链接衬线！

由于a在CSS里实在是太多了，咱这样搜：

a {

在第三次点击下箭头时，看到了这一段：

a {
    color: #e0e0e0;
    text-decoration: underline;
}

我当时研究HTML的时候，还特意研究了超链接衬线，我敢肯定，这个text-decoration就是控制衬线的！

这里有重点，注意啦！

我们需要在其中插入一个语句，控制衬线颜色，让这一段变成这样：

a {

  color: #e0e0e0;

  text-decoration: underline;

  text-decoration-color: bisque;

}

这个问题又解决啦，下一个问题：代码高亮！

你一定认为这是个大工程吧，我当初也这么认为。

首先，打开主题文件夹下的night/codeblock.dark.css，高亮就不关night.css的事儿了。

这个就比较麻烦了。

首先，右击Typora界面内的某一处，选择检查元素，点击出现的面板的左上角的那个鼠标图案，选中你要更改高亮的地方，记住他的class属性。

然后，点击VS Code里的菜单：帮助-切换开发人员工具，按刚才的方式，选中，然后，记好的可不是class了，而是Styles里的颜色属性。

复制，再粘贴到Typora的CSS里。

感觉改高亮这块讲述的不是很细，我会把我改完的Typora-Night上传至Github，看不懂的可以直接下载替换。

点我进入GitHub仓库链接

拜托点个💛Star，这对我很重要！

最终效果：