Typora标题自动显示序号，大纲中也显示序号

Typora标题自动显示序号，大纲中也显示序号

代码一：一级标题显示序号

点击查看代码

/*************************************** Header Counters in TOC (目录中的标题计数器)**************************************/
.md-toc-inner {text-decoration: none;
}/* 在TOC根目录初始化所有计数器 */
.md-toc-content {counter-reset: h1toc h2toc h3toc h4toc h5toc h6toc;
}.md-toc-h1 {margin-left: 0;font-size: 1.5rem;counter-reset: h2toc h3toc h4toc h5toc h6toc; /* 重置所有下级计数器 */
}.md-toc-h2 {font-size: 1.1rem;margin-left: 1.5rem;counter-reset: h3toc h4toc h5toc h6toc;
}.md-toc-h3 {margin-left: 3rem;font-size: .9rem;counter-reset: h4toc h5toc h6toc;
}.md-toc-h4 {margin-left: 4.5rem;font-size: .85rem;counter-reset: h5toc h6toc;
}.md-toc-h5 {margin-left: 6rem;font-size: .8rem;counter-reset: h6toc;
}.md-toc-h6 {margin-left: 7.5rem;font-size: .75rem;
}/* 一级标题前显示序号 */
.md-toc-h1:before {color: black;counter-increment: h1toc;content: counter(h1toc) ". ";
}.md-toc-h1 .md-toc-inner {margin-left: 0;
}/* 二级标题编号: 使用 h1toc 和 h2toc */
.md-toc-h2:before {color: black;counter-increment: h2toc;content: counter(h1toc) "." counter(h2toc) ". ";
}/* 三级标题编号: 使用 h1toc, h2toc 和 h3toc */
.md-toc-h3:before {color: black;counter-increment: h3toc;content: counter(h1toc) "." counter(h2toc) "." counter(h3toc) ". ";
}/* 四级标题编号: 使用 h1toc, h2toc, h3toc, h4toc */
.md-toc-h4:before {color: black;counter-increment: h4toc;content: counter(h1toc) "." counter(h2toc) "." counter(h3toc) "." counter(h4toc) ". ";
}/* 五级标题编号: 使用 h1toc, h2toc, h3toc, h4toc, h5toc */
.md-toc-h5:before {color: black;counter-increment: h5toc;content: counter(h1toc) "." counter(h2toc) "." counter(h3toc) "." counter(h4toc) "." counter(h5toc) ". ";
}/* 六级标题编号: 使用 h1toc, h2toc, h3toc, h4toc, h5toc, h6toc */
.md-toc-h6:before {color: black;counter-increment: h6toc;content: counter(h1toc) "." counter(h2toc) "." counter(h3toc) "." counter(h4toc) "." counter(h5toc) "." counter(h6toc) ". ";
}/*************************************** Header Counters in Content (正文中的标题计数器)**************************************//* 在#write根元素初始化所有计数器，确保即使没有上级标题，计数器也存在 */
#write {counter-reset: h1 h2 h3 h4 h5 h6;
}/* 每个标题元素重置所有下级计数器 */
h1 {counter-reset: h2 h3 h4 h5 h6;
}h2 {counter-reset: h3 h4 h5 h6;
}h3 {counter-reset: h4 h5 h6;
}h4 {counter-reset: h5 h6;
}h5 {counter-reset: h6;
}/* 一级标题前显示序号 */
#write h1:before {counter-increment: h1;content: counter(h1) ". ";
}/* 二级标题编号: 使用 h1 和 h2 */
#write h2:before {counter-increment: h2;content: counter(h1) "." counter(h2) ". ";
}/* 三级标题编号: 使用 h1, h2 和 h3 */
#write h3:before,
h3.md-focus.md-heading:before {counter-increment: h3;content: counter(h1) "." counter(h2) "." counter(h3) ". ";
}/* 四级标题编号: 使用 h1, h2, h3, h4 */
#write h4:before,
h4.md-focus.md-heading:before {counter-increment: h4;content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) ". ";
}/* 五级标题编号: 使用 h1, h2, h3, h4, h5 */
#write h5:before,
h5.md-focus.md-heading:before {counter-increment: h5;content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) ". ";
}/* 六级标题编号: 使用 h1, h2, h3, h4, h5, h6 */
#write h6:before,
h6.md-focus.md-heading:before {counter-increment: h6;content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6) ". ";
}/*************************************** 智能缩进系统* 使用 CSS 变量方便统一调整**************************************/
:root {--h1-indent: 0;--h2-indent: 1.5rem;--h3-indent: 3rem;--h4-indent: 4.5rem;--h5-indent: 6rem;--h6-indent: 7.5rem;
}/* 基础缩进设置 */
#write h1 {margin-left: var(--h1-indent);padding-left: 0;
}#write h2 {margin-left: var(--h2-indent);padding-left: 0;
}#write h3 {margin-left: var(--h3-indent);padding-left: 0;
}#write h4 {margin-left: var(--h4-indent);padding-left: 0;
}#write h5 {margin-left: var(--h5-indent);padding-left: 0;
}#write h6 {margin-left: var(--h6-indent);padding-left: 0;
}/*************************************** 侧边栏大纲编号**************************************/
.sidebar-content {counter-reset: h1 h2 h3 h4 h5 h6;
}.outline-h1 {counter-reset: h2 h3 h4 h5 h6;
}.outline-h2 {counter-reset: h3 h4 h5 h6;
}.outline-h3 {counter-reset: h4 h5 h6;
}.outline-h4 {counter-reset: h5 h6;
}.outline-h5 {counter-reset: h6;
}/* 一级标题显示序号 */
.outline-h1>.outline-item>.outline-label:before {counter-increment: h1;content: counter(h1) ". ";
}.outline-h2>.outline-item>.outline-label:before {counter-increment: h2;content: counter(h1) "." counter(h2) ". ";
}.outline-h3>.outline-item>.outline-label:before {counter-increment: h3;content: counter(h1) "." counter(h2) "." counter(h3) ". ";
}.outline-h4>.outline-item>.outline-label:before {counter-increment: h4;content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) ". ";
}.outline-h5>.outline-item>.outline-label:before {counter-increment: h5;content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) ". ";
}.outline-h6>.outline-item>.outline-label:before {counter-increment: h6;content: counter(h1) "." counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6) ". ";
}/*************************************** 覆盖焦点标题的默认样式**************************************/
#write>h1.md-focus:before,
#write>h2.md-focus:before,
#write>h3.md-focus:before,
#write>h4.md-focus:before,
#write>h5.md-focus:before,
#write>h6.md-focus:before,
h1.md-focus:before,
h2.md-focus:before,
h3.md-focus:before,
h4.md-focus:before,
h5.md-focus:before,
h6.md-focus:before {color: inherit;border: inherit;border-radius: inherit;position: inherit;left: initial;float: none;top: initial;font-size: inherit;padding-left: inherit;padding-right: inherit;vertical-align: inherit;font-weight: inherit;line-height: inherit;
}

代码二：一级标题不显示序号

点击查看代码

/*************************************** Header Counters in TOC (目录中的标题计数器)**************************************/
.md-toc-inner {text-decoration: none;
}/* 在TOC根目录初始化所有计数器 */
.md-toc-content {counter-reset: h1toc h2toc h3toc h4toc h5toc h6toc;
}.md-toc-h1 {margin-left: 0;font-size: 1.5rem;counter-reset: h2toc h3toc h4toc h5toc h6toc; /* 重置所有下级计数器 */
}.md-toc-h2 {font-size: 1.1rem;margin-left: 1.5rem;counter-reset: h3toc h4toc h5toc h6toc;
}.md-toc-h3 {margin-left: 3rem;font-size: .9rem;counter-reset: h4toc h5toc h6toc;
}.md-toc-h4 {margin-left: 4.5rem;font-size: .85rem;counter-reset: h5toc h6toc;
}.md-toc-h5 {margin-left: 6rem;font-size: .8rem;counter-reset: h6toc;
}.md-toc-h6 {margin-left: 7.5rem;font-size: .75rem;
}/* 一级标题前不显示序号 */
.md-toc-h1:before {display: none;
}/* 二级标题编号: 只使用自身的 h2toc 计数器 */
.md-toc-h2:before {color: black;counter-increment: h2toc;content: counter(h2toc) ". ";
}/* 三级标题编号: 使用 h2toc 和 h3toc */
.md-toc-h3:before {color: black;counter-increment: h3toc;content: counter(h2toc) "." counter(h3toc) ". ";
}/* 四级标题编号: 使用 h2toc, h3toc, h4toc */
.md-toc-h4:before {color: black;counter-increment: h4toc;content: counter(h2toc) "." counter(h3toc) "." counter(h4toc) ". ";
}/* 五级标题编号: 使用 h2toc, h3toc, h4toc, h5toc */
.md-toc-h5:before {color: black;counter-increment: h5toc;content: counter(h2toc) "." counter(h3toc) "." counter(h4toc) "." counter(h5toc) ". ";
}/* 六级标题编号: 使用 h2toc, h3toc, h4toc, h5toc, h6toc */
.md-toc-h6:before {color: black;counter-increment: h6toc;content: counter(h2toc) "." counter(h3toc) "." counter(h4toc) "." counter(h5toc) "." counter(h6toc) ". ";
}/*************************************** Header Counters in Content (正文中的标题计数器)**************************************//* 在#write根元素初始化所有计数器，确保即使没有上级标题，计数器也存在 */
#write {counter-reset: h1 h2 h3 h4 h5 h6;
}/* 每个标题元素重置所有下级计数器 */
h1 {counter-reset: h2 h3 h4 h5 h6;
}h2 {counter-reset: h3 h4 h5 h6;
}h3 {counter-reset: h4 h5 h6;
}h4 {counter-reset: h5 h6;
}h5 {counter-reset: h6;
}/* 一级标题前不显示序号 */
#write h1:before {display: none;
}/* 二级标题编号: 只使用自身的 h2 计数器 */
#write h2:before {counter-increment: h2;content: counter(h2) ". ";
}/* 三级标题编号: 使用 h2 和 h3 */
#write h3:before,
h3.md-focus.md-heading:before {counter-increment: h3;content: counter(h2) "." counter(h3) ". ";
}/* 四级标题编号: 使用 h2, h3, h4 */
#write h4:before,
h4.md-focus.md-heading:before {counter-increment: h4;content: counter(h2) "." counter(h3) "." counter(h4) ". ";
}/* 五级标题编号: 使用 h2, h3, h4, h5 */
#write h5:before,
h5.md-focus.md-heading:before {counter-increment: h5;content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) ". ";
}/* 六级标题编号: 使用 h2, h3, h4, h5, h6 */
#write h6:before,
h6.md-focus.md-heading:before {counter-increment: h6;content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6) ". ";
}/*************************************** 智能缩进系统 (可选，根据你的需求调整)* 使用 CSS 变量方便统一调整**************************************/
:root {--h1-indent: 0;--h2-indent: 1.5rem;--h3-indent: 3rem;--h4-indent: 4.5rem;--h5-indent: 6rem;--h6-indent: 7.5rem;
}/* 基础缩进设置 */
#write h1 {margin-left: var(--h1-indent);padding-left: 0;
}#write h2 {margin-left: var(--h2-indent);padding-left: 0;
}#write h3 {margin-left: var(--h3-indent);padding-left: 0;
}#write h4 {margin-left: var(--h4-indent);padding-left: 0;
}#write h5 {margin-left: var(--h5-indent);padding-left: 0;
}#write h6 {margin-left: var(--h6-indent);padding-left: 0;
}/*************************************** 侧边栏大纲编号 (可选)**************************************/
.sidebar-content {counter-reset: h1 h2 h3 h4 h5 h6;
}.outline-h1 {counter-reset: h2 h3 h4 h5 h6;
}.outline-h2 {counter-reset: h3 h4 h5 h6;
}.outline-h3 {counter-reset: h4 h5 h6;
}.outline-h4 {counter-reset: h5 h6;
}.outline-h5 {counter-reset: h6;
}.outline-h1>.outline-item>.outline-label:before {display: none;
}.outline-h2>.outline-item>.outline-label:before {counter-increment: h2;content: counter(h2) ". ";
}.outline-h3>.outline-item>.outline-label:before {counter-increment: h3;content: counter(h2) "." counter(h3) ". ";
}.outline-h4>.outline-item>.outline-label:before {counter-increment: h4;content: counter(h2) "." counter(h3) "." counter(h4) ". ";
}.outline-h5>.outline-item>.outline-label:before {counter-increment: h5;content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) ". ";
}.outline-h6>.outline-item>.outline-label:before {counter-increment: h6;content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6) ". ";
}/*************************************** 覆盖焦点标题的默认样式**************************************/
#write>h3.md-focus:before,
#write>h4.md-focus:before,
#write>h5.md-focus:before,
#write>h6.md-focus:before,
h3.md-focus:before,
h4.md-focus:before,
h5.md-focus:before,
h6.md-focus:before {color: inherit;border: inherit;border-radius: inherit;position: inherit;left: initial;float: none;top: initial;font-size: inherit;padding-left: inherit;padding-right: inherit;vertical-align: inherit;font-weight: inherit;line-height: inherit;
}