# 四级标题缺少一个缩进级别

**URL:** https://meta.discourse.org/t/fourth-level-headings-missing-one-level-of-indentation/276178
**Category:** Support
**Tags:** disco-toc
**Created:** [2023年八月21日 09:26 UTC](https://meta.discourse.org/t/fourth-level-headings-missing-one-level-of-indentation/276178 "2023-08-21T09:26:14Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![Ellery](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ellery/32/315016_2.png) [@Ellery](https://meta.discourse.org/u/Ellery)
#### Post date: [2023年八月21日 09:26 UTC](https://meta.discourse.org/t/fourth-level-headings-missing-one-level-of-indentation/276178/1 "2023-08-21T09:26:14Z")

</div>

在使用 DiscoTOC 组件时，我遇到了一个问题：  
右侧滚动条中的四级标题似乎比三级标题少了一个缩进级别。

 ![image](https://global.discourse-cdn.com/meta/original/4X/4/d/a/4da8cc619f58aee7cc1dfe1ee209459608261947.png)

我已经检查了原始文本，没有发现任何语法错误。  
 ![image](https://global.discourse-cdn.com/meta/original/4X/5/7/3/57388f5279f9d861ebdfddd34b3ca3e035d90110.png)

 ![image](https://global.discourse-cdn.com/meta/original/4X/6/7/c/67cb7e595d53b3bb2f0a3342efc0e059d35e48cc.png)

有人能解释一下可能的原因吗？另外，我想知道这个问题是否有解决方案？

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [2023年八月22日 13:17 UTC](https://meta.discourse.org/t/fourth-level-headings-missing-one-level-of-indentation/276178/2 "2023-08-22T13:17:27Z")

</div>

我认为这是故意的，以免在目录中缩进过多时标题缩小太多。  
实现增量填充的最简单方法是定位 `<li>` 或 `<a>` 元素（使用它们的类，因为它们具有与标题级别相关的类）并添加左填充。

---

<div class="post-metadata">

### Author: ![Ellery](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/ellery/32/315016_2.png) [@Ellery](https://meta.discourse.org/u/Ellery)
#### Post date: [2023年八月24日 02:01 UTC](https://meta.discourse.org/t/fourth-level-headings-missing-one-level-of-indentation/276178/3 "2023-08-24T02:01:53Z")

</div>

感谢您的回复！

但是，实施此解决方案是否需要修改 HTML 代码？您能否提供更具体的指导来解决此问题？

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [2023年八月24日 10:21 UTC](https://meta.discourse.org/t/fourth-level-headings-missing-one-level-of-indentation/276178/4 "2023-08-24T10:21:58Z")

</div>

首先，`<h3>` 到 `<h5>` 标题无法在目录中折叠。需要更改组件以允许此行为。`<h6>` 被组件忽略。

但是，既然您只讨论嵌套，那么这段 SCSS 应该足以满足您的需求：

```scss
.d-toc-main #d-toc li.d-toc-item {
    .d-toc-h4 {
        padding-left: 1.25em;
    }
    .d-toc-h5 {        
        padding-left: 2em;
    }
}

```

 ![image](https://global.discourse-cdn.com/meta/original/4X/7/b/c/7bc8818e6fde72bb4df6c0d23d4d9708866807a9.png)

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [2023年九月23日 10:22 UTC](https://meta.discourse.org/t/fourth-level-headings-missing-one-level-of-indentation/276178/5 "2023-09-23T10:22:29Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.