[ad_1]
La propriété CSS z-index peut être utilisée en parallèle avec la propriété position pour créer un effet de calques comme Photoshop.
Empiler des éléments dans des calques à l’aide de la propriété z-index
Habituellement, les pages HTML sont considérées comme bidimensionnelles, car le texte, les images et autres éléments sont disposés sur la page sans se chevaucher. Cependant, en plus de leurs positions horizontale et verticale, les boîtes peuvent également être empilées le long de l’axe z, c’est-à-dire l’une sur l’autre en utilisant la propriété CSS z-index. Cette propriété spécifie le niveau de pile d’une boîte dont la valeur de position est absolue, fixe ou relative.
La position de l’axe des z de chaque couche est exprimée sous la forme d’un entier représentant l’ordre d’empilement pour le rendu. Un élément avec un indice z plus grand chevauche un élément avec un élément inférieur.
Une propriété z-index peut vous aider à créer des mises en page plus complexes. L’exemple suivant montre comment créer des calques en CSS.
.box {
position: absolute;
z-index: 1;
}
.box2 {
position: relative;
z-index: 2;
}···
[ad_2]
