float和绝对定位的区别：
CSS中脱离文档流，也就是将元素从普通的布局排版中拿走，其他盒子在定位的时候，会当做脱离文档流的元素不存在而进行定位。需要注意的是，使用float脱离文档流时，其他盒子会无视这个元素，但其他盒子内的文本依然会为这个元素让出位置，环绕在周围。
而对于使用absolute positioning脱离文档流的元素，其他盒子与其他盒子内的文本都会无视它。
其中线条为中间到两端渐变用背景图片添加
<ul class="nav">
<li><a href="#">医院首页</a><i></i></li>
<li><a href="#">专家咨询</a><i></i></li>
<li><a href="#">在线咨询</a><i></i></li>
<li><a href="#">来院路线</a></li>
</ul>
.nav{
width:6.4rem;
height:0.66rem;
background:#bd2b58;
}
.nav li{
float:left;
width:1.59rem;
height:0.66rem;
position:relative;
}
.nav li a{
display:block;
float:left;
width:1.58rem;
height:0.66rem;
line-height:0.66rem;
text-align:center;
font-size:0.27rem;
color:#fff;
}
.nav li i{
display: block;
/*float: right;*/当用float时候 背景会被字占据位置不会显示
width: 0.02rem;
height: 0.66rem;
background: url("../images/i.png");
background-size: 100% 100%;
background-position: 0 0;
position: absolute; /*改用绝对定位文本盒子无视他*/
right: 0px;
}