HTML布局水平导航条1制作

该文是用css制作个导航条，用竖线分隔，导航条是点击的多个区块。
步骤：
ul里设置需要数量的li，li中加上a链接
给ul加样式，去掉默认的前面的点
给li设置左浮动，让ul里的li横向排列
a链接设置成块状显示，设置宽高和背景色
给a加样式，去默认的下划线，设置文本水平居中
设置文本垂直居中，由于没有垂直居中样式，用行高来让链接里文字垂直居中
给a链接文本设置合适的颜色，替换默认的链接色
给已经设置成区块的a链接加右侧的边线，边线粗细样式颜色
设置最后一个li去掉右边线
如后期修改标签内容，担心内容超出，可给已经区块显示的a标签设置overflow:hidden;

a标签设置为block，然后设置宽高后，a标签里面的文字可以用text-align:center设置水平居中，如果想垂直居中，可以设置行高和设置的a标签的高height相等，这样就能让里面的文字在垂直方向上居中。
垂直居中的方法：设置line-height=区域a标签的高。
该文中用的右侧边框先是黑色单线1px粗细，太黑了和背景色显示对比比较突兀，可根据需要修改。

样式代码：

ul{
   list-style-type:none;}
li{
   float:left;border-right:1px solid #000000;}
li a{
   display:block;width:100px;height:50px;background-color:#e88383;text-align:center;text-decoration:none;line-height:50px;color:#ffffff;overflow:hidden;}
li:last-child {
   border-right: none;}

页面代码：

<ul>
<li><a href="">简短问答</a></li>
<li><a href="bloglistindex.html">博文备份</a></li>
<li><a