CSS: select previous sibling [duplicate]

2019-01-26 15:33发布

问题:

This question already has an answer here:

  • Is there a “previous sibling” CSS selector? 13 answers

I've got a list and want to select the previous and next of the one I am hovering

<ul>
    <li>Item1</li>
    <li>Item1</li>
    <li>Item1</li>
    <li>Item1</li>
    <li>Item1</li>
</ul>

I am able to select the next sibling with the "+" selector. But is there a possibility to get the previous?

ul li:hover + li {
    color:red;
}

I already tried ul li + li:hover but it doesn't work. Can't belief there is no tricky hack that I could use.

Sure I can do this easily through Javascript but I don't like using JS where I can get the same result with CSS.

回答1:

There's no way to do this with pure CSS, if you really must select the previous sibling, you're going to have to resort of Javascript or suchlike.