注意事项
垂直分割线(应用vertical-line类的标签)的父元素定位方式不能是static
position属性值的区别请参考 https://www.runoob.com/cssref/pr-class-position.html
效果图
设置分割线在我多个的经验施行后，没有一成不变通用的方法，得根据要求采用最适合的。
1、使用字符“|”，适合导航栏间距不一致时，也就是不适合你。
2、采用背景方式，背景图片即是那条间隔线，需要形成jpg、gif、png格式的小图片，在背景里设置居左，并控制一下垂直位移，这样就会出现你第一张图的要求。
3、但最后一项可能会出现没有间隔线的情况，那么就多添加一个空的li或a，这样就多出来一个间隔线，好看。
具体细节需要把握，代码举例：
xlMenu a { background:url(menuLine.gif) no-repeat display:block width:77px text-align:center float:left}.xlMenu a.first { width:43px background:none text-align:left}
效果：
小图标：
很小很小的一条线。。。
#welcome ul li em { display:blockfloat:leftheight:7pxmargin:6px 0border-right:1px solid #bcbcbcoverflow:hidden}#welcome ul li em [选择ID为welcom的容器下ul li 里的em元素为样式试用对象]
display:block[做为块元素显示]
float:left[靠左浮动，默认li元素是列显示，用了float可以让容器在一行内显示]
height:7px[高7像素]
margin:6px 0[子容器距父容器上下边框的距离分别为6像素，等同于margin:6px 0 6px 0]
border-right:1px solid #bcbcbc[容器右边框显示为1像素，实线，颜色为#bcbcbc]
overflow:hidden[超出容易可见面积部分内容不显示]
