格式化无序列表,使其不会像段落一样缩进

Formatting unordered list so it doesn't indent like a paragraph

本文关键字:段落一 缩进 无序 列表 格式化      更新时间:2023-09-26

我正在使用jquery . tocity .js javascript插件以编程方式生成一个目录表。不过,我遇到了一点问题。插件的操作方式,它拉出每个h1, h2, h3等标签,并创建一个嵌套列表,同时尊重深度。

我遇到的问题是,如果我有一个长字符串的h2,目录中的格式出现"错误"。特别是,列表项的第一行是嵌套的,但内容像段落一样流动:

顶层标题

的次标题

a Long Title

另一个副标题

很抱歉这个近似不好,但我希望它能让我明白我所看到的。

是否有办法将列表项设置为整个次标题缩进到相同的深度,以便它(大约)显示为:

顶层标题

的次标题

a Long Title

下面是生成的目录表(具有长名称)的示例:

<ul id="tocify-header7" class="tocify-header nav nav-list">
  <li class="tocify-item active" data-unique="the-fifth-(and-successful)-try" style="cursor: pointer;"><a>The Fifth (and Successful) Try</a></li></ul>

看起来像navnav-list应该来自Bootstrap,但我不确定Bootstrap3甚至有一个nav-list类了。

编辑:是的,看起来插件与Bootstrap 3不兼容。我想我会买一个不同的插件。

您应该将锚点显示为块并为它们设置最大宽度。这将迫使它们在结束处循环,但保持相同的缩进。