Wie kann ich die Deckkraft eines übergeordneten DIV steuern, ohne seine untergeordneten Elemente zu beeinträchtigen?

Deckkraft in verschachtelten Elementen steuern

Beim Arbeiten mit verschachtelten DIV-Elementen kann es manchmal wünschenswert sein, die Deckkraft des übergeordneten Elements ohne anzupassen Auswirkungen auf seine Kinder. Dies kann mithilfe der CSS-Eigenschaft „background-color“ zusammen mit der Funktion „rgba()“ erreicht werden.

Lösung:

So legen Sie die Deckkraft eines übergeordneten DIV fest, ohne dessen zu beeinflussen Verwenden Sie für das untergeordnete DIV das folgende CSS Syntax:

.parent {
  background-color: rgba(r, g, b, a);
}

Erklärung:

Die Eigenschaft „Hintergrundfarbe“ legt die Hintergrundfarbe eines Elements fest. Mit der Funktion rgba() können Sie die Farbkomponenten mithilfe der Werte Rot (r), Grün (g) und Blau (b) angeben. Der letzte Parameter, a, stellt Alpha-Transparenz dar. Dieser Wert reicht von 0 (vollständig transparent) bis 1 (vollständig undurchsichtig).

Um beispielsweise das übergeordnete DIV zu 50 % transparent zu machen und gleichzeitig die Farbe seines untergeordneten DIV beizubehalten, wenden Sie das folgende CSS an:

.parent {
  background-color: rgba(0, 0, 0, 0.5);
}

Hinweis: Diese Technik gilt nur für die Hintergrundfarbe des übergeordneten Elements. Es hat keinen Einfluss auf andere visuelle Eigenschaften des untergeordneten DIV, wie z. B. Textfarbe oder Schriftgröße.

Das obige ist der detaillierte Inhalt vonWie kann ich die Deckkraft eines übergeordneten DIV steuern, ohne seine untergeordneten Elemente zu beeinträchtigen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!