css – 如何在一个多行包装句子中的每一行添加水平填充?

前端之家收集整理的这篇文章主要介绍了css – 如何在一个多行包装句子中的每一行添加水平填充?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这是我的代码
<div><p><span>... highlighted text ...</span></p><p>Chapter info</p></div>

这是它现在的样子:

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

有没有办法在突出显示的文本的两边添加填充? SPAN上的常规填充不起作用,因为它只考虑句子的开头和结尾,而不是每行.

有任何想法吗? CSS3代码很好.

解决方法

经过一段时间的努力,我发现一个非古怪的解决方案,对于旧版浏览器来说,有一个不错的回退 – 将两个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;
}
原文链接:https://www.f2er.com/css/216838.html

猜你在找的CSS相关文章