样式主题

OneMark 支持使用 CSS 自定义渲染后的样式，兼容常见的 markdown 样式文件，对 Typora 主题进行了特别支持。你可以下载、修改或者创建自己想要的样式。

通常来说，在编辑器中切换主题会应用到所有笔记。OneNote 中很难实现这一点，因此切换主题只会影响当前笔记和之后创建的笔记，过往笔记不受影响。

安装主题

1. 点击“打开主题目录”。
2. 将 .css 文件复制到目录下。
3. 点击“重新加载主题”。

带图标的引用

在引用内使用标题 > # 可以增加图标以及额外的样式，例如：

1

> # 提示

你可以在 .css 文件中通过修改 CSS 变量来自定义图标， 支持使用任意 emoji 或者文字替换。了解如何设置 CSS 变量。

设置 CSS 变量

你可以在任一主题 .css 文件的最后，增加:root变量区，复制并修改想要设置的变量，实现部分样式自定义。如果想要应用到所有主题，请修改 __global.css。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

:root {
  /* 字体 */
  --font-family: 'Microsoft YaHei';
  
  /* 页面背景 */
  --bg-color: #ffffff;

  /* 行高（值代表字号的倍数）。行间距=行高-1 */
  --line-height: 1.5;

  /* 段落间距 */
  --paragraph-margin: 0.5em;

  /* 代码等宽字体 */
  --monospace: "Consolas";

  /* 编辑状态光标背景色 */
  --select-text-bg-color: #B5D6FC;

  /* 编辑状态光标文字颜色 */
  --select-text-font-color: #767676;

  /* 引用内 h1-h6 前缀图标 */
  --blockquote-heading-icons: 🔍,⭐,💡,📝,⚠️,⛔; 

  /* 开启/关闭引用内标题的前缀图标 */
  --enable-heading-in-blockquote: true;

  /* 代码块显示行号 */
  --enable-code-line-number: false;

  /* LaTeX 默认输出为图片 */
  --enable-latex-to-image: true;
}

注意：

• 修改.css文件后，需要点击“重新加载主题”，并重新在列表中选择一次主题。
• 不要整体复制上面的示例代码，以免造成意外的样式冲突。只复制需要明确修改的变量。
• 只对自带的主题有效。
• 由于 css 规则十分自由，以上变量并不能保证一定全局生效。例如，有的主题可能会为某些元素指定特殊的字体，此时修改--font-family并不会起作用。

FAQ

• 如果对 .css 进行修改后想查看效果，需要先点击“重新加载主题”，然后再选择一次主题。
• 主题列表最多可展示 10 项选择，按照最近编辑时间筛选。
• 旧版笔记以及非 OneMark 创建的笔记也可应用主题。
• 过低的 OneNote 版本或者 Windows 版本可能导致主题显示有 bug。

附录：支持的样式属性

与常规的 CSS 规则相比，由于 OneNote 样式表达的局限性，部分属性支持受限。

• 链接 <a> 不支持修改颜色和下划线。
• 只有标题和 inline 元素(code em等)支持 ::before/after 伪元素
• 不支持圆角border-radius