Text in Layers

CHICKEN

Supper

With CSS, it is possible to work with layers: pieces of HTML that are placed on top of the regular page with pixel precision.

Source:


<div style="position:relative; font-size:50px; z-index:2;">LAYER 1</div>

<div style="position:relative; top:-50; left:5; color:red; font-size:80px; z-index:1">LAYER 2</div>

To create a layer all you need to do is assign the position attribute to your style. The position can be either absolute or relative. The position itself is defined with the top and left properties. Finally, which layer is on top is defined with the z-index attribute.

text in layers CSS style sheets