标签：images image pre lis osi webkit sandbox span near
分割线效果如下
思路：
通过设置渐变背景色(top,white,white)的位置(垂直居中，水平居右)和宽度(2px)、高度(80%)
最后一个按钮的背景色设为none，即可现按钮的分割线
示例代码
CSS：
ul{display: flex; display:-webkit-flex; max-width:600px; margin:auto; background:lightblue; text-align:center; padding:0px;} ul li{flex:1; -webkit-flex:1; list-style:none; background:linear-gradient(top,white,white); background:-webkit-linear-gradient(top,white,white); background:-moz-linear-gradient(top,white,white); background:-ms-linear-gradient(top,white,white); background:-o-linear-gradient(top,white,white); background-size:2px 80%; background-position:center right; background-repeat: no-repeat; line-height:60px;} ul li:last-child{background:none;}
HTML：
<ul> <li>TAG FIRST</li> <li>TAG SECOND</li> <li>TAG THIRD</li> </ul>
在线演示：http://sandbox.runjs.cn/show/3xw6c1ba
标签：images image pre lis osi webkit sandbox span near
原文地址：http://www.cnblogs.com/chenxiangling/p/7753370.html
