在有序列表中对齐文本

Question

我正在从 XML （ TEI ）源构建 HTML 并且需要实现行号。 如您所见，文本的对齐方式并不令人满意：

目前，它在 HTML 中看起来像这样

<br label="#region_1641631166648_18l8">
9   liecht •Und got ſach das liecht ,
<br label="#region_1641631166648_18l9">
10  das es gut was vnd ſchid das 
<br label="#region_1641631166648_18l10">

由于 HTML 是如何使用 XSLT 创建的以及源数据的外观，因此使用表或列表的方法不是一个好的选择。 所以也许还有其他选择，比如使用<span>和 CSS？

Answer 1

看来您可以控制生成的 html。 因此，您可以将数字括在<span>标记中，并使用 css 对其进行样式设置。 就像是：

 .lineNumber { display: inline-block; width: 3em; text-align: right; margin-right: 2em; }

 <br label="#region_1641631166648_18l8"> <span class="lineNumber">9</span>liecht •Und got ſach das liecht, <br label="#region_1641631166648_18l9"> <span class="lineNumber">10</span>das es gut was vnd ſchid das <br label="#region_1641631166648_18l10">

有了这个，您还可以正确对齐下方的数字。