我想悬挂缩进“元素符号”- 即在顶行前缀(即“1.”或“1a”)之后换行缩进的段落。
例如，请参见以下 html
<html><body>
<div style="text-indent: -3em; padding-left: 3em;">1. bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla </div>
</body></html>
为什么第一个 bla 下的换行没有缩进？我怎样才能达到这种效果？
我正在寻找的是一个通用公式，以便给定前缀大小，即 3 表示“1.”或 5 表示“1a”。”，我可以计算出我需要为文本提供的 css 和值-缩进和 padding-left 以实现适当的悬挂缩进。
无论文档的字体大小如何，我都希望解决方案保持一致。 我也不是在寻找有序列表解决方案。
最佳答案
这是一个示例，其中包含有序列表和 CSS 计数器。
ol {
counter-reset: section;
list-style-type: none;
text-indent: -1em;
}
li::before {
counter-increment: section;
content: counters(section,".")" ";
display: inline-block;
width: 1em;
}
.sub-level {
counter-reset: inner;
}
.sub-level li::before {
counter-increment: inner;
content: counter(section)"."counter(inner, lower-alpha);
}<ol class="top-level">
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</li>
<li>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.</li>
<li> quis nostrud
<ol class="sub-level">
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</li>
<li>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.</li>
</ol>
</li>
</ol>关于html - CSS 'bullet' 使用 em 单位的悬挂缩进，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33114942/