【已解决】大佬们，有序列表换行如何对齐

疑问解答
11

确实，这有序列表位数不同的缩进也不同
有两个思路：

  1. 9. 之后10.之前的元素调整缩进 - css无解，需要JavaScript，参考Heading Level Indent插件
  2. 多位数列表行调整缩进，对齐一位数的列表
  • 通过style处的属性选择二位数序号的行.HyperMD-list-line.HyperMD-list-line-1.cm-line:not(.HyperMD-list-line-nobullet)[style*="text-indent: -55px;"]（需要使用:not伪类把Shift+Enter的行排除掉），然后移动 42-55=-13px
  • 再修改Shift+Enter的行中缩进元素的宽度，对齐到有序列表行
/* 二位数序号的有序列表行 - 左移 */
.HyperMD-list-line.HyperMD-list-line-1.cm-line:not(.HyperMD-list-line-nobullet)[style*="text-indent: -55px;"]
{
  transform: translateX(-13px);
}
/* Shift+Enter行的缩进 - 调整宽度*/
.HyperMD-list-line.HyperMD-list-line-1.HyperMD-list-line-nobullet.cm-line .cm-indent{
  min-width: 0!important;
  width: 43px!important;
}
  • 效果如图
    • image
  • 注意：
    • 字号修改后失效，因为元素中的text-indent属性会随着字号变化（有方法解决吗？）
    • 三位数应该用不到吧？需要的话也可以仿照着加一行左移
2 个赞