CSS Z-INDEX
- The
z-index
property specifies the stack order of an element. - An element with greater stack order is always in front of an element with a lower stack order.
z-index
only works on positioned element(position: absolute, position: relative, position: fixed, or position: sticky)- flex items(elements that are direct children of display: flex elements).
EXAMPLE:
<!DOCTYPE html>
<html>
<head>
{
position: absolute;
left: 0px;
top: 0px;
z-index: -1;
}
</head>
<body>
<h1>This is a heading</h1>
<p>Because the image has a z-index of -1, it will be placed behind the text.</p>
</body>
</html>
OUTPUT:
This is heading