當一個元素被佔用時，改變所有其他元素的樣式

比方說，我有一堆div在同一個DOM級別。當我將鼠標懸停在一個上面時，我希望所有其他人都改變風格（即減少不透明度或更改背景），而徘徊的風格則保持不變。當一個元素被佔用時，改變所有其他元素的樣式

我不能使用+或~選擇器，因爲我需要它來選擇所有的兄弟姐妹，而不僅僅是直接相鄰的一個或只有下面的兄弟姐妹。基本上我在找的是「所有兄弟姐妹，但這一個」的選擇。這是否存在？有沒有一種方法可以在沒有JavaScript的情況下實現這個？

2012-09-14 Bobe

訣竅是將懸停僞選擇器放在父元素上，然後相應地設置孩子的樣式。以下是我指的是：

.parent:hover .child { 
    opacity: .5; 
} 
.parent .child:hover { 
    opacity: 1; 
}

2012-09-14 05:42:07 joshnh

哇，這太微不足道了，我感到羞愧，我想不起來。謝謝。 – Bobe

但是等一下，有一個問題。在我提到的這些div之間有很多空的空間，我不希望它們通過將光標放在父div中進行調光。 – Bobe

完全是這樣。如果你不想這樣做，JavaScript就是要走的路。 – joshnh

上面的例子非常好，但如果有div之間出現保證金，你不想要的效果，觸發當懸停在空的空間時，不需要JavaScript。

這裏有一個簡單的解決方法：

只需添加float:left到.child並確保.parent有overflow:visible（它應該是默認可見）。

通過這樣做，.parent變爲0px高（因此空白空間不會觸發該效果），但懸停在.child觸發兩個:hover僞類。

2014-01-12 23:01:04 mtt

回答