Question

我希望在列表的顶部和底部设置包含图像的列表。我知道在css3中，有border-image属性，但是我需要一些适用于旧浏览器的东西。

列表如下所示：

<ul>
 <li> a </li>
 <li> b </li>
</ul>

我需要在所有列表项之前有一个图像，在所有列表项之后有另一个图像。

我知道我可以这样做：

<div id="top-image"></div>
   <ul>
    <li> a </li>
    <li> b </li>
   </ul>
<div id="bottom-image"></div>

还有比这更好的选择吗？

Answer 1

您可能必须在UL background＆amp;中定义底部图像。第一个LI中的顶部图片。像这样：

ul{
 background:url(bottom-image) no-repeat left bottom;
}

li{
 background:url(bottom-image) no-repeat 0 0;
}
li + li{
 background:none;
}