javascript - 为 内的文本添加悬挂缩进

Question

(为清晰起见多次编辑)

注意:我不是编写 HTML 的人。

HTML格式如下(注意:链接和链接后的文字在同一行):

<li>
    <strong>Title of section</strong>
    <br>

    &nbsp;&nbsp;&nbsp;
    <!-- Add hanging indent to subsequent lines if text goes onto second line-->
    <a>link here</a> Some text here...
    <br>

    &nbsp;&nbsp;&nbsp;
    <!-- Add hanging indent to subsequent lines if text goes onto second line-->
    <a>another link</a> More Text ... 
</li>

我想做的是在以链接开头并继续文本的每一行中添加一个悬挂缩进，这样如果文本继续到下一行，后续行将被缩进。

Example of hanging indent (谢谢@Mohsen)

问题说明(以黄色文本开头的行太靠左了，应该缩进以便与上面一行的“链接”对齐):

有没有办法用纯 CSS 做到这一点？如果不是，使用 javascript 或 jQuery？

Answer 1

这可以使用 text-indent 和 padding-left/margin-left 来实现。

li{
    text-indent: -25px;
    padding-left: 25px;
}

Working Fiddle

“text-indent”属性(实验性)也有一个值hanging。检查MDN .