Use of z index css property

gistfile1.txt

Position an image behind the text

img {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
}

<h1>This is a heading</h1>

<img src="w3css.gif" width="100" height="140">

<p>Because the image has a z-index of -1, it will be placed behind the text.</p>

Another use of z index might be the one when you use position fixed for the header bar, then all text will be behind the header bar

#header {
    background-color: #111111;
    color: #FFFFFF;
    height: 40px;
    margin: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
}