一样看了新浪，但是结果就不一样，我就没有那个嗅觉去做一下，去看看它是如何实现的，什么时候才能成为本能思考呢？
下面这是转载的：http://www.daqianduan.com/css-a-line/，补充一下：因为下面都没有html结构，还有他的效果我也没有能看到（点击查看实例展示没有看到效果），所以我 自己根据理解补了一下，如果要是有什么不对的话，还请大家指正。
单个标签实现分隔线：
<div class="demo_line_01"></div>
1 .demo_line_01{
2 padding: 0 20px 0;
3 margin: 20px 0;
4 line-height: 1px;
5 border-left: 200px solid #ddd;
6 border-right: 200px solid #ddd;
7 text-align: center;
8 }
效果是这样的：
特点是简洁，但是不能多行，因为文本多了会直接盖在线上，效果如这样：
巧用背景色实现分隔线：
<div class="demo_line_02"><span>look</div>
1 .demo_line_02{
2 height: 1px;
3 border-top: 1px solid #ddd;
4 text-align: center;
5 }
6 .demo_line_02 span{
7 position: relative;
8 top: -8px;
9 background: #fff;
10 padding: 0 20px;
11 }
效果是这样的：
特点是代码简洁，可自适应宽度，效果这样：
我自己做的，背景色没有取好，所以感觉像个补丁，但是原理我想大家是明白的，就是用背景色块去遮挡文本背后的横线
inline-block实现分隔线：
<div class="demo_line_03"><b></b><span>asdgag<span></div>，这个出来是单个分割线，不知道是不是应该是这样的，还望指正
1 .demo_line_03{
2 600px;
3 }
4 .demo_line_03 b{
5 background: #ddd;
6 margin-top: 4px;
7 display: inline-block;
8 180px;
9 height: 1px;
10 _overflow: hidden;
11 vertical-align: middle;
12 }
13 .demo_line_03 span{
14 display: inline-block;
15 220px;
16 vertical-align: middle;
17 }
效果如下：
特点：文字可多行,我是直接复制的span，效果是这样的：
浮动实现分隔线：
<div class="demo_line_04"><b></b>hdfghdfghdhsdfgsfgsgsdfgsdfg</div>
1 .demo_line_04{
2 600px;
3 }
4 .demo_line_04{
5 overflow: hidden;
6 _zoom: 1;
7 }
8 .demo_line_04 b{
9 background: #ddd;
10 margin-top: 8px;
11 float: left;
12 26%;
13 height: 1px;
14 _overflow: hidden;
15 }
效果是这样的：
利用字符实现分隔线：
<div class="demo_line_05">———————————<span>小小分隔线 字符来实现</span>————————————</div>
1 .demo_line_05{
2 letter-spacing: -1px;
3 color: #ddd;
4 }
5 .demo_line_05 span{
6 letter-spacing: 0;
7 color: #222;
8 margin:0 20px;
9 }
效果这样：
这样以后需要就可以偷个小懒，过来复制咯，呵呵