html - css分隔线问题

Question

我一直在尝试仅使用 CSS 创建一条分隔线，类似于下图。我在许多网站上都看到过这种情况，而且似乎很容易做到。实现这一目标的最佳方法是什么？

Answer 1

我想我已经理解你的问题了，试一试:

<div id="lineWrap">
<span id="center"></span>
<span id="outer"></span>
</div><!--lineWrap-->

div#lineWrap {position:relative; height:3px;}
div#lineWrap span {position:absolute; left:0px; display:block;}
div#lineWrap span#center {top:1px; height:1px; background:#999; width:400px;}
div#lineWrap span#outer {top:0px; height:3px; background:#fd6e6e;width:40px;}

这里>>> http://jsfiddle.net/RHf9L/