Copyright © tutorialspoint.com

HTML <layer> tag



Advertisements

Function:

The HTML <layer> tag is used to position and animate (through scripting) elements in a page. A layer can be thought of as a separate document that resides on top of the main one, all existing within one window.

This tag has support in Netscape 4 and higher versions of it.

Difference between HTML and XHTML:

NONE

Example:

This example creates three overlapping layers. The back one is red, the middle one is blue, and the front one is green.

<layer id="layer1" top="250" left="50" width="200" 
    height="200" bgcolor="red">
  <p>layer 1</p>
</layer>
<layer id="layer2" top="350" left="150" width="200" 
    height="200" bgcolor="blue">
  <p>layer 2</p>
</layer>
<layer id="layer3" top="450" left="250" width="200"
    height="200" bgcolor="green">
  <p>layer 3</p>
</layer>

This will produce following result:

layer 1

layer 2

layer 3

Online Practice:

To Become more comfortable - Do Online Practice

Attributes:

AttributeValueDescription
abovelayer nameThe name of the inline layer that will be positioned directly above the current layer in the z-order.
backgroundURLA filename or URL for an image upon which the inline layer's text and images will appear.
belowlayer nameThe name of the inline layer that will be positioned directly below the current layer in the z-order.
bgcolorrgb(x,x,x)
#xxxxxx
colorname
The color to use for the inline layer background.
clipnumberThe coordinates of the inline layer's viewable area.
heightpixelsThe inline layer's height, in pixels.
leftnumberThe position of the left side of the inline layer. If the current inline layer is part of another layer.called the parent layer-then the position is relative to the parent layer.
namelayer nameThe name of the inline layer.
pagexnumberThe position of the left side of the inline layer relative to the browser window.
pageynumberThe position of the top of the inline layer relative to the browser window.
srcURLThe URL of a page that will appear inside the inline layer.
topnumberThe position of the top of the inline layer. If the current inline layer is part of another layer--called the parent layer--then the position is relative to the parent layer.
visibilityshow
hide
inherit
Determines whether the inline layer is visible.
widthpixelsThe inline layer's width, in pixels.
z-indexnumberThe inline layer's position within the z-order. Inline layers with higher Z-INDEX values are positioned above inline layers with lower Z-INDEX values.

Standard Attributes:

AttributeDescription
classDocument wide identifier
idDocument wide identifier
styleHelps to include inline casecadubf style sheet.

Copyright © tutorialspoint.com