我正在尝试在段落内的多行文本周围设置边框。我基本上不希望边框出现在每一行上，而是出现在所有行周围。
我意识到我可以将所有文本包装在一个 div 中，但它会阻止该文本与段落的其余部分。
我想要一个流畅的段落，并且对于多行中的一个句子，有一个顶部边框、行长度的侧边框和底部边框，并且该边框在句子末尾和下一个句子开始之前结束。
Like so:
你可以尝试叠瓦2个内联元素
b {
outline:solid red;
}
span {
position:relative;
background:white;box-shadow:0 0 0 1px white;
}
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, <b><span>tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.</span></b> Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
如果你想要两边都是直线，可以尝试一下text-align:
p {
text-align:justify
}
b {
outline:solid red;
}
span {
position:relative;
background:white;box-shadow:0 0 0 1px white;
}
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, <b><span>tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.</span></b> Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
这是一支可以玩的笔：http://codepen.io/gc-nomade/pen/dWPGXv http://codepen.io/gc-nomade/pen/dWPGXv
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
