CSS/HTML : indent whole block of text containing hard returns

Question

我想缩进一段文本——所有文本，而不仅仅是第一行——这在布局和文字处理程序中很常见，但我发现这在 CSS 中非常困难。

我试过了 margin-left , padding和 text-indent没有成功。通过结合 margin-left与 display:block-inline , 我设法让 block 缩进但是 display:block-inline在 block 上方添加一个空间，这会破坏布局并且通常看起来很糟糕。显然，另一种方法是 <blockquote>但这已被弃用。谁能建议一种使用 CSS 进行 block 缩进的方法？此外，我试图保持代码轻量级，因此不想对列表进行复杂的样式设置，因为这适合更大的页面。
除了这个问题外工作正常。谢谢:

以下代码缩进 block 但在其上方插入空格。

html

Colors:<br>
<span style="display:inline-block;margin:1em;">
blue<br>
orange - complement to blue<br>
red<br>
purple - blend of red and blue</br>
</span>

Answer 1

它会插入空格，因为您要为跨度的每一侧(顶部、左侧、右侧、底部)设置 margin。
将 span 的样式更改为:

display:inline-block;margin-left:1em;