资讯详情

Typora中文学术排版主题开发:从CSS到PDF导出的完整指南

📅 2026/10/8 20:42:07 | 华诺云谱 👁 阅读
Typora中文学术排版主题开发:从CSS到PDF导出的完整指南
简介一套面向 Typora 用户的中文学术风格主题包脱胎于官方 Academic 主题正文字体改用华文中宋等宽字体选用 CamingoCode并对代码块加入外边框样式适合论文写作、技术博客与日常笔记等场景。压缩包共计 14 个文件、约 15.46 MB以 8 个 woff 字体文件和 2 个 css 样式文件为主体另有 pdf 说明、txt 许可证和 md 文档分别用于安装引导、字体授权说明与使用示例。除核心样式文件外还包含字体配置样式与多款 STIX、中宋字体可改善公式、英文混排与中文显示效果同时支持通过 HTML 标签实现右对齐、居中对齐等扩展排版满足学术写作中的个性化调整需求。目前已有 451 人学习下载适合希望快速获得典雅学术排版、又不愿手动配置字体和样式的 Typora 用户。1. Typora-Academic-Zh为什么中文学术笔记总在排版上翻车用 Typora 写论文初稿、开题报告和课题笔记最难受的不是 Markdown 语法而是导出那一刻标题没有编号、中文首行不缩进、宋体和 Times New Roman 混在一起的间距忽大忽小行距紧得像代码块。Academic-Zh 这类 Typora 中文学术风格主题就是把这套「中文学术排版规范」压缩成一份 CSS装进 Typora 的主题目录后让编辑和导出都按这个规范渲染。它适合要写期刊论文、学位论文、实验报告又不想在 Word 里反复调整格式的人。它的价值不是让 Markdown 更好看而是让 Markdown 写出来的稿子能直接拿去打印前检查。2. 把主题装进 Typorathemes 目录与最小 CSS 骨架2.1 找到 Typora 的 themes 目录Typora 的主题本质上就是一个 CSS 文件。你在编辑器里看到的正文、标题、代码块样式全部由主题 CSS 控制。安装主题的常见做法不是去安装目录里找文件而是通过 Typora 的偏好设置定位到用户级 themes 目录。这样升级 Typora 不会覆盖你的自定义主题换电脑时也只要备份这一个目录。不同系统下用户级 themes 目录的位置不一样。Windows 上通常在当前用户的AppData\Roaming\Typora\themesmacOS 在~/Library/Application Support/Typora/themesLinux 一般在~/.config/Typora/themes。如果记不住最简单的办法是打开 Typora 偏好设置切到「外观」点「打开主题文件夹」系统会自动展开对应目录。下面这组命令适合在终端里快速确认路径# Windows PowerShell Get-ChildItem $env:APPDATA\Typora\themes # macOS / Linux ls $HOME/Library/Application Support/Typora/themes 2/dev/null || \ ls $HOME/.config/Typora/themes这个命令不会创建任何东西只是看当前主题目录里已经有哪些文件。第一次打开时目录里至少有 Typora 默认的default.css、newsprint.css等。Academic-Zh 主题要做的事情就是在这里新增一个academic-zh.css或者你从开源仓库下载整个主题包后把对应 CSS 和资源文件夹放进来。2.2 写一个能被 Typora 识别的 academic-zh.cssTypora 识别主题的规则很简单themes 目录下每个.css文件对应一个可选主题文件名就是主题名。比如academic-zh.css对应「Academic-Zh」切换主题时在菜单里能看到。所以第一步不是写复杂样式而是先放一个最小的合法 CSS 文件让 Typora 承认这个主题存在。cd $HOME/Library/Application Support/Typora/themes touch academic-zh.css用任意编辑器打开academic-zh.css写下面这段骨架。核心是把变量、正文和编辑区宽度先固定下来/* academic-zh.css */ :root { --acad-body: 14pt; --acad-leading: 1.8; --acad-font-cn: SimSun, Songti SC, Noto Serif CJK SC, serif; --acad-font-en: Times New Roman, Liberation Serif, serif; } html { font-size: var(--acad-body); } body { font-family: var(--acad-font-en), var(--acad-font-cn); line-height: var(--acad-leading); text-align: justify; } #write { max-width: 45em; margin: 0 auto; padding: 24px 32px; }这里有两个细节值得解释。第一font-family把西文字体放在中文字体前面是因为 CSS 字体回退按字符逐个进行——英文和数字会优先匹配到 Times New Roman中文因为没有对应的字形会落到后面的宋体系列。第二#write是 Typora 编辑区的根容器限制最大宽度可以让长段落保持舒适的阅读行长。14pt是编辑屏幕上的显示字号后面如果要投 Word改成12pt即可。保存后重启 Typora在菜单栏的「主题」或偏好设置里选择 Academic-Zh。如果编辑区字号和段落行距明显变了说明这个最小主题已经被加载。此时再回到文件里继续加样式就是安全的迭代方式。2.3 主题的加载优先级与调试入口很多人在这一步就踩坑明明在academic-zh.css里写了body { font-size: 14pt; }但切换主题后字号没变。原因通常是 Typora 在加载主题 CSS 之前先加载了默认的base.css而某些选择器优先级更高。CSS 的优先级规则对 Typora 一样有效body与#write这类选择器在同级时后加载的覆盖先加载的但#write属于 ID 选择器优先级高于body。所以凡是与编辑区直接相关的样式尽量包在#write下面例如#write p { text-indent: 2em; } #write h1 { font-size: 1.5em; }如果你不确定当前哪个规则生效Typora 提供了基于 Chromium 的开发者工具。在部分版本里可以通过ShiftF12打开打开后像浏览器检查元素一样选中一个标题或段落右侧计算样式里能看到最终生效的 font-size 和 font-family。第一次做主题时我一般会开着这个调试器逐项核对而不是来回重启 Typora 猜问题。这个习惯后面会省很多时间。3. 中文学术排版四要素字体、字号、行距、首行缩进3.1 字体栈中文宋体、西文 Times顺序决定一切中文学术排版的第一条规矩是「中文用宋体英文和数字用 Times New Roman」。在 Typora 主题里这个目标靠一个字体栈实现。字体栈是font-family属性中的一串候选字体名浏览器或 Typora 渲染时会按顺序找第一个能显示当前字符的字体。注意它不是「一个字体用到底」而是逐字符选择。下面是我常用的字体栈写法:root { --acad-font-cn: SimSun, Songti SC, Noto Serif CJK SC, serif; --acad-font-en: Times New Roman, Liberation Serif, serif; } body { font-family: var(--acad-font-en), var(--acad-font-cn); }参数说明SimSun是 Windows 的中易宋体Songti SC是 macOS 内置的宋体Noto Serif CJK SC是 Linux 上常见的思源宋体。serif是最终兜底保证任何系统上都不至于用无衬线体渲染正文。西文部分Liberation Serif是 Linux 上常见的 Times 替代字体。顺序上一旦把SimSun放前面英文字符也会优先匹配到宋体部分版本导出 PDF 时英文数字会显得「扁」所以Times 必须在最前。如果你的学校要求「中文宋体、西文 Times New Roman、字号小四」那这个字体栈就是刚需。千万不要图省事只写font-family: SimSun;否则英文和 LaTeX 公式里的变量都会变成宋体外审时很容易被挑版式问题。3.2 字号与行距14pt 行距 1.8 的由来学术文档的常用字号是小四12pt或五号10.5pt。但屏幕阅读和纸面排版不一样14pt 在屏上更舒适导出 PDF 后又不至于太小。Academic-Zh 的主题变量里--acad-body是全局基准字号其余所有标题、表格、脚注都用相对单位em这样改一处就能整体缩放。我建议在编辑阶段用 14pt提交前如果要套学校规定的「小四宋体」把--acad-body改成12pt即可。行距方面中文纸本常用 1.5 倍或 20 磅固定行距。这里取1.8是因为 Typora 编辑区是横向流式排版行距太小中文容易「糊」在一起1.8 给标注和阅读留了足够空间。如果是正式投稿行距需要按目标期刊要求调整。h1 { font-size: 1.5em; line-height: 1.4; font-weight: bold; text-align: center; margin: 1.2em 0 0.6em; } h2 { font-size: 1.25em; line-height: 1.35; margin: 1em 0 0.5em; } p { font-size: 1em; line-height: var(--acad-leading); }这里标题特意没有继承正文的1.8行距而是用1.4左右。原因是中文标题通常较长分成两行时如果行距过大会显得松散像一个空行隔开的两个标题。margin控制标题和正文之间的间距学术规范里节标题通常是「段前段后 0.5 行」用em更容易跟随字号缩放。3.3 段落、标题与列表的中文缩进规范中文正文段落开头必须空两格。在 CSS 里最直接的实现是text-indent: 2em。注意这里的em是相对当前字号不是相对屏幕像素所以 12pt 和 14pt 都会保持「两个汉字宽度」的观感。但有一个坑这个规则会无差别套到所有p上包括列表项里的段落、引用块里的段落甚至在表格里也可能失控。我的做法是把缩进限定在正文直接子段落再单独把标题、列表和表格里的段落排除掉#write p { text-indent: 2em; margin: 0.4em 0; } #write h1, #write h2, #write h3, #write li p, #write blockquote p { text-indent: 0; }#write p用的是子选择器只匹配编辑区里最外围的正文段落不会误伤列表项内部段落。blockquote p取消缩进是因为学术引用块通常整体缩进内部段落如果再缩进两个字符视觉上会显得参差。实际使用中如果某个段落是标题下的第一句也需要缩进这个规则是满足的。列表项的处理可以更严格。中文 Word 排版里列表项本身已经有悬挂缩进内部第一行一般不再做首行缩进。所以li p { text-indent: 0; }是对的。如果你真的想要列表内段落缩进可以改成li p但多数情况没这个需求。4. 学术场景的细节标题编号、公式、题注与参考文献4.1 用 CSS 计数器给多级标题自动编号中文学位论文的标题编号通常是「1」「1.1」「1.1.1」手动写进标题文本里会带来两个麻烦调整章节顺序时编号不会自动变复制到目录时还要重新核对。Academic-Zh 主题里可以用 CSS 计数器自动生成编号这样标题文本保持纯文字编号全由渲染层控制。#write { counter-reset: h1 0 h2 0 h3 0; } #write h1 { counter-reset: h2 0 h3 0; counter-increment: h1; } #write h2 { counter-reset: h3 0; counter-increment: h2; } #write h3 { counter-increment: h3; } #write h1::before { content: counter(h1) ; } #write h2::before { content: counter(h1) . counter(h2) ; } #write h3::before { content: counter(h1) . counter(h2) . counter(h3) ; }逻辑说明CSS 计数器和编程计数器类似。counter-reset声明变量并归零counter-increment在匹配到元素时加一。::before伪元素把计数结果显示在标题正文之前。关键点是每次进入新的h1时要把h2和h3重置为 0否则第二章的第一个小节会显示成「1.3」而不是「2.1」。一个需要知道的坑这个编号只作用于标题本身Typora 的[TOC]目录生成的是标题文本不会带上::before里的编号。所以如果你依赖编辑器的自动目录要么让目录区域和实际标题不一致要么放弃 CSS 编号把编号写进标题文本。我一般倾向于后者因为投稿时目标期刊常常要求「第 1 章」或「1.1」这类固定写法交给 CSS 反而不灵活。4.2 公式块与图表题注的样式适配Typora 的公式渲染基于 MathJax主题 CSS 能控制公式块的对齐和间距但控制不了公式内部字体。中文学术排版的公式通常要求「独立成行、居中」公式变量多为斜体。Academic-Zh 至少要把公式块对齐和与正文的间距做对#write .math { font-size: 1em; line-height: normal; } #write .math-block { text-align: center; margin: 1em 0; }.math是 Typora 给数学公式 DOM 节点的通用类名.math-block是块级公式特有的类。这两个选择器在不同版本 Typora 里可能稍有差异但用 DevTools 检查后一般都能对上。注意不要给公式块设置「文字对齐到两端」否则公式和编号之间的空格会被拉伸得很难看。图表题注在 Markdown 里默认没有对应语法。常见做法是改用行内 HTML自己包一层figure和figcaptionfigure img src实验流程.png alt实验流程 / figcaption图 1 实验流程示意图/figcaption /figure对应的 CSSfigure { text-align: center; margin: 1.2em 0; } figcaption { font-size: 0.875em; text-align: center; color: #333; margin-top: 0.4em; }这里把图题放在图片下方符合「图题在图下」的国标习惯。表格题注同理只是要手动放在表格前面通常做法是写一行居中的粗体文字。Academic-Zh 不会为表格自动生成题注但样式上需要让figcaption和手动题注段落一致。4.3 参考文献列表与引用块参考文献列表在 Word 里常见的是「编号 悬挂缩进」即编号顶格内容缩进对齐。Markdown 的有序列表正好具备这个结构但默认样式往往太紧凑。Academic-Zh 里我一般把参考文献列表单独设置为小五号或五号行距略小于正文#write ol { padding-left: 1.5em; } #write ol li { font-size: 0.875em; line-height: 1.6; margin: 0.2em 0; text-indent: 0; list-style-type: decimal; }padding-left控制编号与文本之间的距离。如果采用 GB/T 7714 格式参考文献条目很长时换行会自动对齐到左侧编号区域的外侧这个悬挂效果由有序列表的默认样式实现不需要额外处理。list-style-type: decimal显式声明数字编号避免被某些主题覆盖成圆点。引用块在中文学术文档里常见于直接引文通常要求整体左右缩进、字号小一号。Typora 的blockquote默认有左侧边框Academic-Zh 会把边框换成浅色保留缩进感#write blockquote { border-left: 3px solid #ddd; margin: 1em 0 1em 1.5em; padding: 0.5em 1em; background: #fafafa; font-size: 0.875em; text-indent: 0; }这里边框宽度 3px 是视觉上比较克制的选择太宽显得像代码块。背景色#fafafa是极浅灰打印时几乎看不出色块但屏幕阅读时能区分引用与正文。5. 避坑清单版本差异、PDF 导出、闪退与主题失效5.1 现象升级 Typora 后主题样式全变这条我亲身翻车过。某次 Typora 大版本更新后标题编号全部消失正文首行缩进也从 2em 变成了 0。原因不是 Academic-Zh 没加载而是新版本调整了编辑区 DOM 结构部分#write h1::before选择器不再匹配内容节点或者 Typora 内置了同名样式把::before的content覆盖为空。解决这类问题只有一个可靠路径打开 Typora 的开发者工具选中一个标题看它实际 HTML 层级和类名。如果发现标题被包裹在div里选择器可以放宽为#write div h1或直接用.content h1。更稳的方案是不要过度依赖#write后代选择器优先用标签选择器加!important兜底h1::before { content: counter(h1) !important; }!important是最后手段只用于和内置样式硬碰硬的场景。别在字体这类视觉属性上滥用它会让后续调试变得很痛苦。5.2 现象导出 PDF 中文字体乱套在 Typora 编辑器里看着是宋体导出 PDF 后却变成黑体一样的无衬线体或者中文间距突然拉宽。这通常是字体栈里的字体名在目标系统上不存在导出时要 Trypora 内置的 PDF 渲染进程自己去找替代字体找不到就落到系统默认无衬线体。解决分两步。第一步确保font-family的字体名与系统实际安装的字体名一致。Windows 上不要再写Songti SC那是 macOS 的macOS 上系统里很可能没有SimSun要写Songti SC。第二步给页面打印设置明确的纸张和页边距用pagepage { size: A4; margin: 25mm 20mm; }size: A4约束纸张大小margin控制页边距。Typora 导出 PDF 时对这个规则的兼容性总体不错但注意它不会为没有安装的字体自动做替换。最稳的交叉平台写法是中文字体用serif兜底英文用Times New Roman, serif这样即使专职字体缺失渲染出的仍是衬线体系。5.3 现象代码块中文变成方框或等宽挤成一团代码块通常使用等宽字体比如Consolas、Cascadia Code或Menlo。这些字体没有中文字形中文字符会回退到系统默认中文字体可能是宋体也可能是无衬线体。结果是中文注释在代码块里变得和英文不协调甚至在 Windows 上出现方框。给代码字体增加中文字体回退即可code, tt { font-family: Cascadia Code, JetBrains Mono, Microsoft YaHei, monospace; font-size: 0.9em; }Cascadia Code是 Windows/macOS 上常见的新等宽字体JetBrains Mono比较受写代码的欢迎。Microsoft YaHei是中文无衬线体放在等宽字体后面负责中文字符。注意monospace放在最后保证特殊符号仍有等宽字形可回退。这样中文注释至少不会变成方框间距也比默认好很多。5.4 现象Typora 启动闪退严格说主题 CSS 导致 Typora 闪退的概率不高但确实存在。最常见的原因是 CSS 里写了import url(...)去请求远程字体Typora 启动加载主题时会在线拉取资源。如果网络环境不稳请求一直挂起轻则主题切换不出来重则整个进程卡死闪退。另一个可能是一个 CSS 文件里引用了本地缺失的字体文件比如font-face的src: url(...)指向一个被删掉的 woff2。解决思路是让主题完全离线自洽。删掉所有import字体只写系统字体名不引外部资源。主题文件本身用 UTF-8 无 BOM 保存中文注释里避免特殊控制字符。如果你从一个现在仍维护的仓库下载主题通常不会遇到这类问题如果是从某篇教程里复制 CSS见到import就多留个心眼。5.5 现象把同一主题放进 Obsidian 就不认了饭经常在 Typora 与 Obsidian 之间来回切换。同一个 Academic-Zh 主题放到 Obsidian 的.obsidian/themes里结果标题编号、引用块样式全部错乱甚至主题名都识别不了。原因很清楚Obsidian 的主题接口不是简单的 CSS 文件摆放它要求 themes 目录里是一个文件夹里面至少包含manifest.json和一个.css而且很多 Typora 专属选择器如#write、.math-block在 Obsidian 里不存在。如果你确实要两处一致CSS 选择器要改成两者都认的折中写法。例如#write, .markdown-preview-view { font-family: var(--acad-font-en), var(--acad-font-cn); line-height: var(--acad-leading); }但更现实的做法是别指望一套 CSS 能同时服务两个编辑器。Typora 的主题机制和 Obsidian 的 CSS 变量体系差距大硬迁移会不断修选择器。Academic-Zh 的定位就是 Typora 专用Obsidian 侧直接复制字体和行距的核心变量即可不必追求全局一致。6. 进阶用开发者工具验证 Academic-Zh 的每个样式值主题做完不等于能用建议在投稿前做一次「体检」。打开 Typora 的开发者工具切到 Console手动执行几行 JavaScript快速检查计算样式是否符合预期。下面的命令能输出正文段落的实际字号、行距和首行缩进const p document.querySelector(#write p); if (p) { const s getComputedStyle(p); console.log(font-size:, s.fontSize); console.log(line-height:, s.lineHeight); console.log(text-indent:, s.textIndent); }如果输出的text-indent是24pt而不是你写的2em说明某个父级规则覆盖了它。此时要做的不是加!important而是顺着计算样式里「被继承」「被覆盖」的来源找到冲突选择器。我的习惯是一次只改一个变量保存后重载主题再跑一遍上面的脚本避免多个改动叠加后搞不清翻了哪里的车。更进一步准备一份固定的验证文档里面包含中英文混排段落、三级标题、代码块、公式块、引用块和一条参考文献。导出 PDF 后逐项对比页边距是否符合 A4 要求标题编号是否连续图片题注是否居中参考文献编号是否悬挂。这样做一次之后每次改主题都跑同一套检查能省掉大量的重复人工核对。Academic-Zh 这类主题做到最后真正有价值的部分不是某个字体大小而是让你确信导出的 PDF 不会在盲审前一刻出现首行不缩进这种低级问题。踩过的坑多了之后我现在对任何主题都会先备份原主题文件再动刀。希望这套思路能帮你少走一段弯路。本文还有配套的精品资源点击获取
📝

华诺云谱内容团队

资深建站顾问 · 行业研究员

10年+企业数字化服务经验,专注智能建站、SEO优化与品牌营销,持续输出建站技巧、行业洞察与营销干货,已帮助5000+企业实现数字化增长。

你可能需要的服务

订阅华诺云谱资讯周报

每周一封,精选建站技巧、SEO与营销干货,直达邮箱。已有 8,000+ 企业主订阅,助你少走弯路。

↑