列表项目的背景图像

Question

认为它很简单。

我正在网站上工作。 设计是here

关于如何制作页脚策略，我遇到了一些障碍管理|回收

由于每个项目都有与之关联的背景图像，因此如何定位背景图像以使其位于列表项目的最底部。我试过了background: bottom center;

但它似乎只是把它推到了后面。

对此有任何帮助表示赞赏。

Answer 1

这样的东西？我使用了一些红色正方形的随机图像，这可能就像你的图像一样容易。

<击> http://jsfiddle.net/chricholson/5NC7L/

http://jsfiddle.net/chricholson/5NC7L/1/

HTML：

<ul>
    <li>link</li>
    <li>link</li>
    <li>link</li>
</ul>

CSS：

li {
    padding: 0 0 50px 0;
    display: inline-block;
    background: url('http://www.martin.com/color/small/red305.1.gif') no-repeat bottom center;
}

Answer 2

我可能会这样做：

a.strategy   { border-bottom: 44px solid #CC7A16;}
a.management { border-bottom: 44px solid #00718C;}
a.recovery   { border-bottom: 44px solid #954256;}