Css 基于文本对齐bg图像

是否可以根据文本结束的位置对齐背景图像

演示代码：

.textBox .text { padding-top: 8px; background: url('../images/text-top.gif') left top no-repeat; padding-right:15px; }
.textBox .bottom { padding: 0px 0px 20px 15px; background: url('../images/text-bottom.gif') right bottom no-repeat; }

<div class="textBox">
<div class="text">
<div class="bottom">blah blah blah multi-line text here</div>
</div>
</div>

.textBox.text{填充顶部：8px；背景：url（'../images/text-top.gif'）左顶部不重复；填充右侧：15px；}
.textBox.bottom{填充：0px 0px 20px 15px；背景：url（'../images/text bottom.gif'）右下角不重复；}
诸如此类的多行文字

我想要完成的是在文本末尾对齐../images/text-bottom.gif。

尝试添加显示：

.textBox .bottom {
     ....
    display: inline;

}

---

不，简单显示内联；不行。 但我找到了解决办法

我将最后一个单词放在[span]标记中，所有文本放在[p]标记中，并修改css，如下所示：

.textBox .bottom { padding: 0px 0px 20px 15px; } 
.textBox p { padding-bottom: 21px; font-size: 14px; line-height: 21px; color: #666; position:relative; } 
.textBox .bottom p span{ background: url('../images/text-bottom.gif') top right no-repeat; width:auto; padding-left:5px; padding-right:15px;height:40px; display: inline;

---

使用正则表达式，我找到了文本的最后一个单词，并将其括在[span]中，它的工作方式与我想要的一样

，您的代码有什么问题？bg图像放在容器div的最右侧，而不是文本的末尾