这是一款用CSS实现的div+css实现圆角背景文字导航条代码，采用了最简单的实现方式，无背景图片，代码简单易懂，给初学者学习参考。
<div class="m-nav">
<ul>
<li><a href="#">青岛星网</a></li>
<li class="sx">|</li>
<li><a href="#">青岛星网1</a></li>
<li class="sx">|</li>
<li><a href="#">青岛星网2</a></li>
<li class="sx">|</li>
<li><a href="#">青岛星网3</a></li>
</ul>
</div>.m-nav{ width:90%; margin:50px auto; height:40px; background:#F30E47; border-radius:5px;}
.m-nav ul li{ list-style:none; float:left; line-height:40px;}
.m-nav .sx{ width:2px; height:40px; overflow:hidden; color:#FFFFFF;}
.m-nav ul li a{ color:#FFFFFF; text-decoration:none; line-height:40px; width:100px; display:block; text-align:center;}
在线QQ：
