Régulation de la superposition des éléments sur l'axe Z en CSS

L'ordre de superposition des éléments peut être régulé à l'aide de la propriété z-index, qui accepte comme valeur des nombres entiers positifs ou négatifs, ou zéro. La propriété fonctionne uniquement pour les éléments dont la valeur de position est définie comme absolute, fixed ou relative.

Lors de l'utilisation de cette propriété, la règle de superposition des éléments est la suivante : l'élément qui sera au-dessus est celui dont la valeur de z-index est la plus grande.

Modifions l'ordre de superposition des éléments de l'exemple précédent. Pour cela, donnons au premier élément un z-index supérieur à celui du second, par exemple, comme ceci :

css#elem1 {
  z-index: 2;
}
#elem2 {
  z-index: 1;
}

Résultat de l'exécution du code :

Задание 1

Reproduisez la page selon cet exemple :

Задание 2

Reproduisez la page selon cet exemple :