: hover ama: belirli bir sınıfta değil

89

Bir aöğeye fareyle üzerine gelme efekti uygularken a, sınıftaki bir öğeye nasıl uygulamam active?

a:hover(not: .active)

Görünüşe göre bir şeyler eksik.

html css css-selectors

— Jürgen Paul
kaynak

178

İşlevsel gösterim açık :not(), değil :hover:

a:not(.active):hover

:hoverİlk sırayı almayı tercih ederseniz , sorun değil:

a:hover:not(.active)

Hangi sözde sınıfın önce veya sonra geldiği önemli değildir; her iki durumda da seçici aynı şekilde çalışır. :hoverYapısal sözde sınıfların arkasına kullanıcı etkileşimi sözde sınıfları yerleştirme eğiliminde olduğum için, bu sadece benim kişisel kuralımdır.

— BoltClock
kaynak

1

Eğer onlar desteklemediği için göründükleri gibi olsa sürümü 9 öncesinde IE desteklemek için gerekirse dikkatli olun not() msdn.microsoft.com/en-us/library/... . Eğer yaparsanız, belki cevabı @Mendhak'a bakın.

— SharpC

7

not()Seçiciyi kullanma seçeneğiniz var .

a:not(.active):hover { ... }

Ancak, tüm tarayıcılar CSS3 özelliklerini uygulamadığından, bu tüm tarayıcılarda çalışmayabilir.

Büyük bir kitleyi hedefliyorsanız ve eski tarayıcıları desteklemek istiyorsanız, en iyi yol için bir stil tanımlamak .active:hoverve yaptığınız her şeyi geri almak olacaktır a:hover.

— Mendhak
kaynak