导航分割线 - 爱码网

.nav li{
    position:relative;
    display:inline-block;
    padding:0 16px;
    font-size: 13px;
    text-shadow:1px 2px 4px rgba(0,0,0,.5);
    list-style: none outside none;
  }

1.制作导航分隔线

.nav li{background:linear-gradient(to bottom,#dd2926,#a82724,#dd2926) no-repeat right / 1px 15px;}

2.删除第一个和最后一个导航分隔线

.nav li:last-child{background:none;}

/删除最后一个/

原理：使用背景颜色background渐变分别给每个li右侧添加宽1px、高15px（如果该数值>li的高度，则超出部分隐藏）的背景色，看起来就是分隔线的效果
补充：no-repeat right / 1px 15px; 这几个参数的意义：
　　1：right为背景色起始绘制位置，也就是从右边开始；
　　2:1px为背景色绘制宽；
　　3:15px为背景色绘制高度；
导航分割线