Html 在无序列表项之间划分图像

我使用无序列表作为垂直导航栏，并尝试在每个元素之间有一个图像作为分隔线，除了列表上方和下方的一条

我正在使用以下css

ul>li{
    display:block; 
    list-style-type: none;
}

ul>li:before{
    content:url(http://s21.postimg.org/eonynopdv/divider.jpg);
}

ul>li:last-child:after{
    content:url(http://s21.postimg.org/eonynopdv/divider.jpg);
}

在每个元素之间放置一个2px高的图像，尽管它与列表项是内联的。是否可以设置这些图像的样式，使其正确显示在上方和下方

---

尝试css3边框图像属性

border-image:url(image.png) 30 30 round;

---

您只能在需要的边上应用边框。

我总是喜欢使用：after和：before来创建一些附加效果

 ul>li:before{
    position: absolute;
    width: 100%;
    height: 1px;
    background: green;
    content:'';
    left: 0;
 }

诸如此类

在此处检查此css：

ul>li{
边框顶部：10px实心；
列表样式类型：无；
边框图像：url(http://s21.postimg.org/eonynopdv/divider.jpg) 30 30;
}
李：第一个孩子{
边界顶部：0无；
}

---

使用

背景图像

相反，我尝试了这种方法，但这种方法只能有上面/下面的一幅图像，而不能同时检查我在上面附加的小提琴。在您的示例中，使用内联块可以使线条与文本内联。将这些更改为block使其按我的要求工作-因此，谢谢！哦，好的，欢迎你：）