但相信大家在使用的过程中依然有很多感觉到不完美的地方，鉴于这是一款基于Electron进行开发的软件，开发者很贴心地提供了调试功能，基于此功能我们可以更加快速地得到我们想要的定制样式。
注：用同样的方法，可以对任意的markdown编辑器进行排版样式表的修改。另外本文所提供的主题也是可以在其他编辑器中使用的，例如MWeb、VSCode等等。
相信很多少数派作者都跟我有同样的痛苦，富文本与纯文本字之间的切换，令排版非常困难。往往到了上传到站点的时候，甚至想清空格式，然后手动编辑一遍。
少数派风格主题的typora皮肤来啦，在少数派官方、typora，以及任何markdown编辑器之间进行无缝切换，更加顺滑的markdown编写体验，更好的排版样式。
注：源文件只是一个样式表，意味着理论上你可以用来替换任意markdown编辑器中的样式主题。已经有作者用到MWeb中啦。
重新打开你的typora软件，主题中就可以进行选择应用。使用的过程中，有什么意见或者建议，欢迎提issues或者直接站内私信我。
直接复制typora实时渲染下的内容，粘贴到少数派编辑器，点击保存，即可预览排版结果。
优化了图片标签：
说明文字
不支持脚注
虽然支持脚注这样的写法，但是少数派站点的脚注是需要根据标签内部包括的div中sup-text标签来取用的，这样就不满足markdown写法啦，所以不支持。
直接把富文本复制到typora中，会处理为对应的markdown格式。
先来谈谈如何基于现有网站样式定制，相信很多朋友其实是没有编程基础的。
那么在这里手把手教大家如何扒网站的编辑器皮肤，然后应用到你的软件中，此处以少数派为例。
之所以想自定义typora主题，就是因为每次markdown格式转成富文本，再复制到少数派的编辑器上面来，实在是太难受了，而且样式基本等于简化后的富文本——啥也不是。
解决方案也有很多：
基于以上的解决方案，其实要想一个自己测试通过而且顺眼的排版结果，还是得自己动手。就算是使用方案二，也得对一下markdown的css样式，所以干脆动手改改，一劳永逸。
markdown与HTML之间的渲染，存在一个对应的关系。markdown虽然只要求你用最简明的标记语言，来进行编写，但它实际会成为一个结构明晰的html网页。可以说markdown提供了一个骨架，而样式表就是给它一套外观。
他们之间存在的对应关系，就可以让我们对此进行修改。我用以下这个表格进行一个简单的映射，修改时可以用这个表格进行对照：
代码段：
```language代码```表格：
|Tables|Are|Cool|
|-------------|:-------------:|-----:|
|col3is|right-aligned|$1600|
|col2is|centered|$12|
|zebrastripes|areneat|$1|
style标签里就是样式名称，可以看到这个wangEditor-txt就是少数派官方编辑器的样式名称啦。
点它，得到一个css文件。
复制这份css文件就好，保存到本地，至此你已经把少数派站点的样式表扒下来啦。
在这一步骤中，我们直接基于默认主题github进行改造。
在偏好设置中选择外观，打开主题文件夹，复制一份github.css，名称改为sspai.css（示例，自定义英文名称就可以，中文展示主题界面会乱码）。
在我们得到的这份副本中，typora除了在文本的markdown部分，还包含了自身界面的css样式定制。
接下来，在第一步中扒下来的少数派主题样式做如下处理：
（画*号为必要步骤，其余两步如果实在不会可以跳过，基本没什么影响）
重启你的编辑器，可以在主题选项中看到sspai，勾选应用主题。
到了这一步，已经得到一个基本的编辑器文本内容部分的皮肤啦。
总结一下以上两个步骤：
这是最简单粗暴的方案了，但可能还是会存在不尽如人意的地方。
比如在以少数派为例的过程中，发现编辑器皮肤有点难看，这里还需要调整下细节。
typora是基于electron开发的一款软件，而且官方也提供了调试功能。
简单地说来，可以理解为typora其实是一个web应用，electron给它包了一个无边浏览器的壳子。
mac在选项中的帮助一栏勾选enabledebug，windows在偏好设置中勾选开启调试即可，然后你就可以在应用中任何一处点击右键，会出来一个「检查元素」选项。
浏览器调试台其实也是一个所见即所得的地方，你可以直接在右边最顶层的样式中随心修改颜色和字体大小等等。
还记得我第一张动图中点击那个箭头吗，没错还按它，然后任意选择你想要修改的地方，此处以h4标题为例。
然后左边的html代码里会高亮你选择的部分，点击右键=>Copy=>Copyselector，得到当前样式的选择器。
然后我们得到如下代码——
#write>h4:nth-child(46)>span#write就是编辑器文本区域，h4是4级标题，后面跟的46是第几个节点，要使用的时候简化如下：
#write>h4简单地说，请反复理解前置步骤章节，只需要里面的几个标签就可以了，不认识的你可以直接删除。
示例，如下代码可以得到背景为粉红色的16号红色的4级标题：
#write>h4{
font-size:16,
}
*除了在软件内直接点击修改整个软件的样式外，也可以把文本内容导出为HTML格式，然后在网页中调试查看，针对markdown内容部分的调整更为方便快捷。
按照上述方法得到的markdown结果是很粗犷的，实际上少数派的样式也有一些细节，接下来就是针对细节进行调整优化。
除了按照第三步的debug方法，把细节对比了一遍后，还新增了一些优化。
对于使用markdown进行文本编辑，我对于图片的痛点如下：
我自己是mac和windows双平台使用的，mac上面截图倒是优雅美观，windows还得找模拟阴影的截图软件。
为了图片更加美观，最好还得符合一定的宽高比例。因此，假设图片的alt标签大家都不怎么需要用，做了3个img自定义：
如上所述，因为我把alt标签用来做图片处理了，而且typora本身也没有把图片说明文案显示在下方。这里单独对图片说明文字做了一次修复。
也就是说，图片说明文字跟alt标签优化功能不冲突。
其他样式修复就不写啦，都是同样的道理。
想要自定义样式，那么首先我们先拆解一下，typora主题本身自带的样式内容。
除了样式表自带内容以外，只要你能通过debug方法找的界面元素，都是可以修改的。
使用如下几个设置可以进行基本的排版修改：
示例，直接写在css末尾覆盖掉默认样式，得到颜色为紫色，字间距10px的标题及段落：
h1,
h2,
h3,
h4,
h5,
h6,
p{
color:darkmagenta;
letter-spacing:10px;
反复咀嚼前文如何自定义少数派主题的前置步骤，以及第三步调试大法，可以针对你想修改的地方进行排版调整，此处不再赘述。
windows上跟mac区别最大的，莫过于字体。
主题文件夹下面，除了单独的github.css，还有对应的github目录，可以看到其实都是不同字型的字体文件。
下面4个定义的@font-face则是跟文件夹中对应的4种字型，分别在常规、斜体、加粗、斜体且加粗4种情况下引用不同的字型。
那么接下来开始自定义字体。
有两种方案，使用你本机安装的字体，或者下载好一些字体放在对应的目录下面。
打开你本机的字体库，以windows为例，菜单栏搜索「字体」就会出来。
此处仅示例如何替换常规字型，其他字型同理。
首先要确保你本机安装了该字体，然后通过互联网搜索到字体对应英文表示法：
Windows预装：
黑体：SimHei
宋体：SimSun
新宋体：NSimSun
仿宋：FangSong
楷体：KaiTi
仿宋GB2312：FangSongGB2312
楷体GB2312：KaiTiGB2312
微软雅黑：MicrosoftYaHei（Windows7开始提供）
OSX预装：
冬青黑体:HiraginoSansGB（SNOWLEOPARD开始提供）
华文细黑：STHeitiLight（又名STXihei）
华文黑体：STHeiti
华文楷体：STKaiti
华文宋体：STSong
华文仿宋：STFangsong
对照上表，黑体的英文表达为「SimHei」，替换字体为黑体：
body{
font-family:SimHei;
效果如图：
如何查看当前字体是否应用正确呢？依然是打开控制台，在盒型下面搜索font-family，下方会显示当前渲染字体RenderedFonts。
分析一下github.css自己定义的字体，4个@font-face都定义了同一个名字叫做「OpenSans」，分别定义了这个字体的4种字型。
然后在font-family中定义了取用的字体。如果英文表达中有空格则需要引号包裹，否则不需要，会按照定义的顺序去查找字体，直到找到为止，否则取用默认字体。
这里建议先定义英文字体，再定义中文。因为中文字体中一般是含有字母的，那么会直接取用到中文的字体，英文效果比较差。
@font-face{
font-style:italic;
font-weight:bold;
color:rgb(51,51,51);
line-height:1.6;
所以，如果没有对字型有特殊要求，那么只需要下载一个字体就好了。加粗、斜体依然会有效果的。
依样画葫芦，下载了一个字体到本地，先定义字体名称，再使用：
到这里，基本就结束啦。如果对编辑器自定义主题，还有什么别的问题，欢迎站内私信我，或者直接留言。