Um exemplo de uso do Z-index é quando queremos definir que um elemento fique por cima de outro no documento.
Veja abaixo o exemplo:
<div style="position:absolute;left:30px;top:30px;Z-index:3">
<table width="50" height="50" bgcolor="#f9f9f9">
<tr><td></td></tr>
</table>
</div>
<div style="position:absolute;left:20px;top:20px;Z-index:2">
<table width="50" height="50" bgcolor="#cccccc">
<tr><td></td></tr>
</table>
</div>
<div style="position:absolute;left:10px;top:10px;Z-index:1">
<table width="50" height="50" bgcolor="#696969">
<tr><td></td></tr>
</table>
</div>acima há 3 divs com os Z-index em ordem decrescente, isso é para você ver que simplesmente a ordem das divs não interfere, mas, sim, o valor do Z-index.
Quanto mais alto for o valor do Z-index, maior será o seu posicionamento em relação aos outros Z-index.
