Layering elements in CSS3

<p>Layers</p>
    <div style="background-color:red; width:300px; height:100px; position:relative; top:100px; left:80px; z-index:2">Layer2
    </div>
    <div style="background-color:yellow; width:300px; height:100px; position:relative; top:50px; left:35px; z-index:1;">Layer3
    </div>
    <div style="background-color:green; width:300px; height:100px; position:relative; top:-140px; left:120px; z-index:3;">Layer1
    </div>

• In the above code snippet we have defined the layers which uses the property z-index to change the layers by giving the value of the zindex value,
• Height and width value to change the position of the layer, the position elements changes the values in the layers to set the different positions of the layers 

output