很不错！

我想问下为什么这个“|”未设置position：absolute时，页面时看不到“|”？

	/*使用伪元素制作导航列表项分隔线*/
		.nav li:after{
             content:"";
             position:absolute;
             right:0px;
             top:20px;
             height:15px;
             width:1px;
             background:linear-gradient(to bottom,#f82f87,#B0363F,#f82f87);
		}
       /*删除第一项和最后一项导航分隔线*/
		.nav li:last-child:after{
             height:0px;
             width:0px;
    	 }

想问一下position的这个right和top是相对于哪个元素定位的？相对于父元素ul吗?

我将这里的right改为left，然后再删除导航里写.nav li:first-child:before 为什么不对呢？

打扰了。 

代码好像有点问题，如果我再多些几个<a>标签，背景渐变就会有问题

为什么这里position不能用relative，我试了用relative，渐变色没效果。。

原写法，第一条分割线宽度是不是变成2px了！

为什么要用渐变呢？想不清楚啊？

<?php 
    echo 
?>

gfvg

.nav li:not(:first-child):before{
    content: "";
    position: absolute;
    top:20px;
    left: 0;
    width: 1px;
    height: 10px;
    background-image: linear-gradient(to top, #818181, #525252,#818181);

}