CSS Layers
It is a concept of layering in which we can control the stacking order of different elements. This can be achieved using the z-index
property.
The z-index
property is used in conjunction with the position
property to create a layered effect. It allows us to specify which element should appear on top and which element should appear at the bottom.
The position
property can have values such as relative
, absolute
, or fixed
, depending on the design requirements. This property helps create more complex web layouts.
The z-index
property accepts numeric values, and the stacking order can be controlled by increasing the numeric value. Here's an example illustrating the use of z-index
:
Input:-
Output:-