在文本段落中放置空隙

Question

我有一个带有长文本的文本段落：

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

我在右上角为此段落设置了背景图片。我想强制这个文本不要覆盖这个背景，但浮动它。所以我需要一个高度有限的“部分”padding-right（背景图像的高度）。

是否可以只使用CSS？

Answer 1

您可以使用浮动伪元素。

jsFiddle Demo

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