Layers overview

Layers are used to position elements at exact locations in the browser window. Layers can contain text, images, plugins, and even other layers — anything you can put in the body of an HTML document you can also put in a layer. Layers are especially useful for making parts of your page overlap.

You can show and hide layers with behaviors to create fast-loading pages that change without loading additional content from source files. You can make layers move or change over time with the Timeline.

Click Show Me to see how to create and position layers.


 
About layers

There are two layer formats for positioning content on a page: CSS layers and Netscape layers.

CSS layers (also known as CSS-P elements) position content on a page using the DIV and SPAN tags. The properties of CSS layers are defined by the World Wide Web Consortium's Positioning HTML Elements with Cascading Style Sheets.
Netscape layers position content on a page using the Netscape LAYER and ILAYER tags. The properties of Netscape layers are defined by Netscape's proprietary layer format.

Both Microsoft Internet Explorer 4.0 and Netscape Navigator 4.0 support layers created using the DIV and SPAN tags. Only Navigator supports layers created with the LAYER and ILAYER tags. Earlier versions of both browsers will display the contents of a layer, but will not position them.

In Dreamweaver, the term layer refers to any element that can be positioned at exact coordinates on the page. Positioning properties include left and top (x and y coordinates, respectively), z-index (also called the stacking order), and visibility. Positioned elements can be defined with the DIV, SPAN, LAYER, and ILAYER tags in Dreamweaver. See Layer preferences.