Wie kann ich mithilfe von CSS den Stil eines untergeordneten Elements ändern, wenn ich den Mauszeiger über sein übergeordnetes Element bewege?

Ändern von Elementen beim Schweben mit CSS

Wenn Sie mit der Maus über ein bestimmtes Element fahren, möchten Sie möglicherweise Änderungen an einem anderen Element vornehmen. Dies kann durch CSS erreicht werden, aber nur, wenn das ausgeblendete Element ein untergeordnetes Element des schwebenden Elements ist.

Betrachten Sie das folgende Beispiel:

<div>

Um die Hintergrundfarbe des ausgeblendeten Div. zu ändern Wenn Sie mit der Maus über das Geparden-Div fahren, fügen Sie das folgende CSS hinzu:

#cheetah {
  background-color: red;
  color: yellow;
  text-align: center;
}

a {
  color: blue;
}

#hidden {
  background-color: black;
}

#cheetah:hover #hidden {
  background-color: orange;
  color: orange;
}

Durch die Angabe von #cheetah:hover #hidden sind Sie es Wählen Sie das versteckte Div nur aus, wenn sich der Mauszeiger über dem Geparden-Div befindet. Dadurch können Sie das Erscheinungsbild ändern, ohne andere Elemente zu beeinflussen.

Das obige ist der detaillierte Inhalt vonWie kann ich mithilfe von CSS den Stil eines untergeordneten Elements ändern, wenn ich den Mauszeiger über sein übergeordnetes Element bewege?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!