這個元素爲什麼選擇自己？

-1

我試圖突出顯示緊挨着該項目懸停的項目之前的列表項目。這個元素爲什麼選擇自己？

<ul> 
    <li><a href="#">link</a></li> <!-- this one should be highlighted when... --> 
    <li><a href="#">link</a></li> <!-- ...this one is hovered --> 
    <li><a href="#">link</a></li> 
    <li><a href="#">link</a></li> 
</ul>

但是，我使用的選擇器li + li:hover出於某種原因正在選擇自己。 li:hover + li選中li立即以下一人徘徊，但我需要一個之前立即它。我是否使用了錯誤的選擇器？

這裏的一個示範fiddle問題：

來源

2013-07-12 Stephen Collins

我不認爲這是可能的CSS但隨後又也許有人可以啓發我們所有 – Huangism

的選擇是做什麼它應該是。目前純CSS中沒有辦法選擇元素的同級_previous_。 JavaScript是需要的。 – ScottS

你不能在'CSS'中遍歷'DOM'。 –

加號選擇器選擇以下加元素。所以li + li:hover正在尋找一個盤旋li立即之前另一個li

見The Adjacent-Sibling Selector

這是它可能是最好充滿了Javascript語言，CSS的空白。

來源

2013-07-12 20:16:44

CSS組合器只能訪問後代和後來的兄弟姐妹。他們無法訪問以前的。

一旦CSS4惡有惡報，你可以這樣做：

!li! + li:hover

（注：語法沒有最終確定，因爲據我所知）

然而，在此期間，試試這個：

ul, ul>li {transform:scaleY(-1)}

並顛倒列表中項目的順序。

Demo

來源

2013-07-12 20:16:59

演示是我最初嘗試的。所以，如果我的理解是正確的，那麼在CSS4被採納之前我無法完成的事情是正確的？ –

你最初的嘗試是否包含'transform'？ –

有趣的想法。太糟糕的來源秩序必須扭轉。 – ScottS

這個元素爲什麼選擇自己？

回答

相關問題