Inserting a layer

Dreamweaver lets you create layers on your page easily and position them precisely. You can also create nested layers. For more information, see Nesting layers.

When you insert a layer, Dreamweaver displays the layer's border, by default, and highlights the block when you move the pointer over it. You can enable layer borders by disabling both Layer Outlines and CSS Layout Outlines in the View > Visual Aids menu. You can also enable backgrounds and the box model for layers as a visual aid while you design. For more information, see Working with CSS layout visualization.

To change the highlight color of a layer or to disable highlighting, see Changing the highlight color for div tags.

After you create a layer, you can add content to it by simply placing your insertion point in the layer, and then adding content just as you would add content to a page.

To draw a single layer or multiple layers consecutively:

1. In the Layout category of the Insert bar, click the Draw Layer button.
   
   
2. In the Document window's Design view, do one of the following:
   • Drag to draw a single layer.
   • Control-drag (Windows) or Command-drag (Macintosh) to draw multiple layers consecutively.

   You can continue to draw new layers as long as you do not release the Control or Command key.

To insert a layer at a particular place in the document:

• Place the insertion point in the Document window, and then select Insert > Layout Objects > Layer.

  NOTE

  This procedure places the tag for the layer wherever you clicked in the Document window. The visual rendering of the layer may thus affect other page elements (like text) that surround it.

To place the insertion point in a layer:

• Click anywhere inside the layer's borders.

The layer's borders highlight, and the selection handle appears, but the layer itself is not selected. For information on selecting layers, see Selecting layers.

To show layer borders:

• Select View > Visual Aids and select either Layer Outlines or CSS Layout Outlines.

  NOTE

  Selecting both options simultaneously will have the same effect.

To hide layer borders:

• Select View > Visual Aids and deselect both Layer Outlines and CSS Layout Outlines.

Related topics

• Nesting layers
• Setting layer preferences and properties
• Managing layers
• Manipulating layers