菜单分隔线不显示
帮我看下是哪里出错了
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.foot{height: 100px;}
a{color: #0000FF;text-decoration: none;}/*取消a的下划线*/
.nav li{list-style:none;float:left;font-size: 16px;margin: 10px 10px ;}
.nav ul{width: 600px;margin: 0 auto;}/*设置ul块自动居中*/
/*菜单选项间的分隔线 为什么不起作用？*/
.nav li:after{content: "";
position: absolute;
right: 0;
top: 10px;
height: 5px;
width: 1px;
background: linear-gradient(to bottom,#f82f87,#B0363F,#f82f87);}
.nav li:last-child:after{width:0px; height:0px;}
</style>
</head>
<body>
<div class="foot">
<div class="nav">
<ul>
<li><a href="">关于昵图</a></li>
<li><a href="">网站公约</a></li>
<li><a href="">网站声明</a></li>
<li><a href="">帮助中心</a></li>
<li><a href="">联系我们</a></li>
<li><a href="">常见问题</a></li>
<li><a href="">网站地图</a></li>
</ul>
</div>
</div>
</body>
</html>
