您可以使用+选择器来选择下一个元素：

li:hover + li {
    background-color: red;
}

前一个元素没有选择器。
编辑：这里有一个类似于gvee的答案的方法。

我想我可能在纯CSS中破解了这个......它确实包含了一点黑客来逆转自然的z-index，我不喜欢，但它整理了事情。
理论是这样的：你为li设置一个固定的高度，并给予它一个相同值的border-top-width。然后你可以将列表项“堆叠”在一个和另一个的顶部，这样顶部边框就可以“假装”成为上面项的背景。
够了，让我们展示代码...

JSFiddle：http://jsfiddle.net/gvee/Awjmp/

HTML

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
</ul>

CSS

* {
    margin: 0;
    border: 0;
    padding:0;
}
ul {
    width: 200px;
    border: 1px solid black;
    list-style-type: none;
    background-color: #eee;
    margin: 10px;
    overflow: hidden;
    /* stop the first item's border bursting the container */
}
li {
    height: 20px;
    border-top-width: 20px;
    /* li.height */
    border-top-style: solid;
    border-top-color: #eee;
    /* ul.background-color */
    position: relative;
    margin-top: -20px;
    /* -li.height */
}
li:hover {
    background-color: red;
    /* "current" colour */
    border-top-color: yellow;
    /* "previous" colour */
}
li:hover + li {
    background-color: lime;
    /* "next" colour */
}
/* HACK... reverse the natural z-index */
 li:nth-child(9) {
    z-index: 1
}
li:nth-child(8) {
    z-index: 2
}
li:nth-child(7) {
    z-index: 3
}
li:nth-child(6) {
    z-index: 4
}
li:nth-child(5) {
    z-index: 5
}
li:nth-child(4) {
    z-index: 6
}
li:nth-child(3) {
    z-index: 7
}
li:nth-child(2) {
    z-index: 8
}
li:nth-child(1) {
    z-index: 9
}

JSFiddle：http://jsfiddle.net/gvee/q6QS5/

HTML

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
</ul>

CSS

li:hover
{
    background-color: red;
}

li:hover + li
{
    background-color: lime;
}

.previous
{
    background-color: blue;
}

JQuery

这是突出显示“previous”项所必需的

$('li').hover(function() {
    $(this).prev().toggleClass('previous');
});