css - 在文本段落内放置空白

Question

我有一段文字很长:

<p>Lorem ipsum ... </p>

我在右上角设置了这段文字的背景图。我想强制此文本不覆盖此背景，而是 float 它。所以我需要一个高度有限(背景图像的高度)的“部分”padding-right。

是否可以仅使用 CSS？

Answer 1

您可以使用 float 伪元素。

jsFiddle Demo

p {
    width: 300px;
    height: 300px;
}
p:before {
    content: "";
    float: right;
    width: 50px; 
    height: 50px;
}