Typora的官网上有提供了一些主题（https://theme.typora.io/）。除了官网的theme gallery以外，也尝试过少数派等平台提供的主题文件。但是不论是哪一款theme，总会有一两个不是很称心如意的地方。
比如想要用Typora来写课程论文（不会用LaTeX，目前感觉Word进行排版是最万能的，不过挺花费精力），却没有使用宋体和Times New Roman的主题；表格的形式也不符合学术风格。而在自己平时写笔记的时候，会想着用一些长在自己审美点上的主题。用一个好看的标题风格，甚至给界面添加一张图片。于是逐渐走上了魔改Typora主题文件的不归路……
Typora的主题文件是用css文件写的。我对css可以说一窍不通，所采用的方法基本就是网上查教程+尝试修改文件代码。很多工作仅仅是不同主题文件之间对应代码块的搬运。其中可能有很多冗余或者无效的内容，希望懂行的大佬轻喷orz
一、课程论文模板
代码主体是github主题。修改了高亮的背景色（原来的亮黄色饱和度太高了，看久了会不舒服），中文字体是宋体，英文字体是Times New Roman。导出PDF正文字号为13px（相当于中文四号和小四之间）。表格换成横线条形式，和实验数据表一样。
1. 修改文本高亮背景色
绝大多数主题文件的高亮都是默认亮黄色的。这种只要用记事本打开主题文件，在末尾加上这段代码就可以了。
mark {
background: #BBFFFF;
}
其中BBFFFF是十六进制RGB代码，你可以自己挑选一个颜色，然后将这个颜色的代码替换进去。
假如文件已经有形如mark{...}这样的代码了，删掉之后再输入自己的代码。
2. 修改文本字体
记事本打开主题文件，ctrl+F打开搜索框，输入“font-family”。然后将每一处冒号后面都替换成自己想要的字体。举例其中一处修改：
@font-face {
font-family: 'Times New Roman',宋体;
font-style: normal;
font-weight: normal;
}
如果中文和西文的字体要求不一样，用逗号隔开两种字体就可以了。
3. 修改字号
css语言中定义字体大小有两种单位：一种是rem，一种是px。前者是相对大小，即这种字体相对于基础字号的大小。后者是绝对大小。
这里修改字体只是为了导出成PDF以后的格式需要，所以只在@media print里面修改字号就好了；代码主体里面的font-size改变的是Typora编辑器界面上显示的字号大小，这个以观看的舒适程度为准就好了。
html {
font-size: 16px; ## 这里是编辑器显示的字号
}
… …
@media print {
html {
font-size: 13px; ## 这里是导出文件里的字号
}
table,
pre {
page-break-inside: avoid;
}
pre {
word-wrap: break-word;
}
}
二、日常笔记模板
代码主体是sspai，这份主题已经很接近我心中完美的风格了。二级标题和引用文本是sspai主题的高光点。
存在缺陷：
- 原本主题的表格没有边线，内容一旦较长，相邻两列的文字就会贴得过紧
- 图片缩放功能似乎没有？
- 正文占据整个屏幕的宽度，阅读起来有一点吃力
- 高亮文本依然是糟糕的亮黄色
从github模板里面植入了一些代码块过来以后，这些缺陷就消失了。
1. 更改表格
将代码里面形如table{...}的全部删去，替换成github主题里面的代码块：
table {
padding: 0;
word-break: initial;
}
table tr {
border-top: 1px solid #dfe2e5;
margin: 0;
padding: 0;
}
table tr:nth-child(2n),
thead {
background-color: #f8f8f8;
}
table th {
font-weight: bold;
border: 1px solid #dfe2e5;
border-bottom: 0;
margin: 0;
padding: 6px 13px;
}
table td {
border: 1px solid #dfe2e5;
margin: 0;
padding: 6px 13px;
}
table th:first-child,
table td:first-child {
margin-top: 0;
}
table th:last-child,
table td:last-child {
margin-bottom: 0;
}
2. 图片缩放
查了资料后发现是我自己搞错了。并不是sspai没有图片缩放功能，而是sspai设定图片必须为100%的缩放率呈现。相比之下github的代码反而十分简单粗暴。由此推测平时用Typora的时候，图片缩放都是由软件自己控制的。而sspai的代码接管了软件的这个功能。所以说，把图片有关的代码块替换之后就重新可缩放了。
figure {
margin: 1em 0;
}
figcaption {
font-size: 0.75em;
padding: 0.5em 2em;
margin-bottom: 2em;
}
figure img {
margin-bottom: 0px;
}
添加图片背景
给自己的github主题增加了图片背景。
先在主题文件夹的路径里面准备好图片，然后在文件的:root{...}里面添加一行代码就可以了。这里调整图片的相对位置花了我很长时间，因为每次都需要改完代码后重开软件才能查看。
:root {
--side-bar-bg-color: #fafafa;
--control-text-color: #777;
background: url(./image/image2.png) -10px 0px no-repeat; ## 添加的一行
}
最后一行中，url(./image/image2.png)是图片路径，放在主题文件下的话只要写相对路径就行。-10px 0px是图片左上角的相对位置（横轴坐标+纵轴坐标），可以多输入几次数值查看效果。no-repeat指图片不重复，没有尝试过其他类型。
