Heim > Artikel > Web-Frontend > Was ist das Z-Index-Attribut?
Was ist das Z-Index-Attribut?
- 藏色散人Original
- 2021-04-19 11:51:5120419Durchsuche
Das Z-Index-Attribut ist ein Attribut in CSS, das zum Festlegen der Stapelreihenfolge von Elementen verwendet wird. Elemente mit einer höheren Stapelreihenfolge stehen immer vor Elementen mit einer niedrigeren Stapelreihenfolge und Elemente können einen negativen Z-Index-Attributwert haben .
Die Betriebsumgebung dieses Artikels: Windows 7-System, Dell G3-Computer, CSS3-Version. Das Attribut „z-index“ legt die Stapelreihenfolge der Elemente fest. Elemente mit einer höheren Stapelreihenfolge erscheinen immer vor Elementen mit einer niedrigeren Stapelreihenfolge.
Hinweis: Elemente können negative Z-Index-Attributwerte haben.
Hinweis: Der Z-Index funktioniert nur bei positionierten Elementen (z. B. position:absolute;)!
Beschreibung
Dieses Attribut legt die Position eines positionierten Elements entlang der Z-Achse fest, die als die Achse definiert ist, die sich vertikal zum Anzeigebereich erstreckt. Wenn es eine positive Zahl ist, ist sie näher am Benutzer, und wenn es eine negative Zahl ist, ist sie weiter vom Benutzer entfernt.
Standardwert: auto
Vererbung: nein
Version: CSS2
JavaScript-Syntax: object.style.zIndex="1"
Mögliche Werte
auto Standard. Die Stapelreihenfolge entspricht der des übergeordneten Elements.
Nummer legt die Stapelreihenfolge der Elemente fest.
inherit gibt an, dass der Wert des Z-Index-Attributs vom übergeordneten Element geerbt werden soll.
【Empfohlenes Lernen:
CSS-Video-TutorialBeispielLegen Sie den Z-Index des Bildes fest:
<html>
<head>
<style type="text/css">
img
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<img src="/i/eg_smile.gif" />
<p>由于图像的 z-index 是 -1，因此它在文本的后面出现。</p>
</body>
</html>Effekt:
Das obige ist der detaillierte Inhalt vonWas ist das Z-Index-Attribut?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!