Heim > Artikel > Web-Frontend > Warum funktioniert mein Z-Index nicht, wenn ich „Transform“ verwende?
Problem:
Sie versuchen, einen Ring mithilfe von Z hinter einen Kreis zu verschieben. Index, aber trotz der Angabe eines negativen Werts für den Z-Index bleibt der Ring vorne.
Erklärung:
In diesem speziellen Fall haben Sie die Transformation auf angewendet das Pseudoelement für den Ring. Wenn die Transformation angewendet wird, hat die Z-Index-Eigenschaft keine Auswirkung mehr.
Lösung:
Um dieses Problem zu beheben, müssen Sie die Transformationseigenschaft entfernen und ersetzen es mit einer alternativen Methode zum Positionieren des Rings hinter dem Kreis.
Code-Snippet:
Entfernen Sie die Transformationseigenschaft und geben Sie die absolute Position für den Ring mit oben und links an Eigenschaften:
<code class="css">#background #mainplanet:after { z-index: -3; top: calc(50% - var(--size)/2) !important; left: calc(50% - (var(--size) * 1.5)/2) !important; }</code>
Dadurch wird sichergestellt, dass der Ring hinter dem Kreis positioniert ist und der Z-Index wirksam ist.
Das obige ist der detaillierte Inhalt vonWarum funktioniert mein Z-Index nicht, wenn ich „Transform“ verwende?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!