css - 如何在一个多行换行句子中的每一行添加水平填充？

Question

这是我的代码:

<div><p><span>... highlighted text ...</span></p><p>Chapter info</p></div>

这是它目前的样子:

http://i48.tinypic.com/2dqvo1i.png

有没有办法在突出显示的文本的两侧添加填充？ SPAN 上的常规填充不起作用，因为它只考虑句子的开头和结尾，而不是单独考虑每一行。

有什么想法吗？ CSS3 代码很好。

Answer 1

经过一段时间的努力，我找到了一个不古怪的解决方案，它对旧版浏览器有不错的回退——在文本行中添加两个 CSS3 阴影:

span {
background:#ff0;color:#000;
box-shadow:0.2em 0 0 #ff0,-0.2em 0 0 #ff0;
-moz-box-shadow:0.2em 0 0 #ff0,-0.2em 0 0 #ff0;
-webkit-box-shadow:0.2em 0 0 #ff0,-0.2em 0 0 #ff0;
}