Heim >Web-Frontend >CSS-Tutorial >Können sich CSS-Hover-Effekte auf nicht zielgerichtete Elemente auswirken?
In CSS ist es nicht direkt möglich, Hover-Effekte auf ein Element anzuwenden, das an ein anderes Element angrenzt oder in diesem verschachtelt ist. Dies bedeutet, dass der Effekt auf das Element beschränkt bleibt, auf das er angewendet wird, und Sie ihn nicht verwenden können, um andere Elemente zu beeinflussen.
Es gibt jedoch zwei Ausnahmen von dieser Regel bei Verwendung des benachbarten Geschwisterselektors ( ) oder des Nachkommenselektors (>):
#first-sibling:hover + #second-sibling { opacity: 0.3; }
#parent-element:hover #child-element { opacity: 0.3; }
In Ihrem konkreten Beispiel möchten Sie die Deckkraft eines Elements namens #thisElement ändern, wenn der Benutzer mit der Maus über ein Bild fährt Klasse von „img.“ Allerdings können Sie #thisElement nicht direkt mit CSS-Hover-Effekten auf „img“ ansprechen. Stattdessen können Sie Folgendes in Betracht ziehen:
.img:hover + #thisElement { opacity: 0.3; }
.img-container:hover #thisElement { opacity: 0.3; }
Das obige ist der detaillierte Inhalt vonKönnen sich CSS-Hover-Effekte auf nicht zielgerichtete Elemente auswirken?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!