include "_i/1.h" ?>
Layers for layout
include "_i/2.h" ?>
Layers for layout
DreamWeaver lets you work with layout "layers" (they're actually <div>'s) in a way that's very similar to working with PhotoShop layers.
These notes are meant to be used in conjunction with assembling the scanning
lab. But if you haven't done that yet, here is an
image or two to
work with.
Remember to save your web page in a particular folder before you insert any images into it, so that DreamWeaver knows how to make the (relative) links to your images.
To insert a layer
... choose "Insert | Layout Objects | AP Div".
or use the Insert-Layout button bar:
AP stands for "Absolute Positioning" layer.
The first thing
you should do is give your layer a semantic name! (You'll have to change the
id in the div tag as well as the associated id style rule.)
You'll see a rectangle on the screen with a handle on the top-left corner
(or else, you get to click-drag to draw a rectangle). Some things you can do
with layers:
- Move the layer by grabbing the handle, dragging and dropping.
- Resize the layer by grabbing any of the handles.
- Insert text or images: Just click once inside the layer
before you type or "Insert | Image".
To rename a layer
DreamWeaver creates a new id when you create a new layer. Usually these are
named "#apDiv1", "#apDiv2",
etc. But of course, you're going to change these id names to something that
reflects their function as soon as possible :-> ! Here's how to re-name
your apDivs:
#1: click anywhere inside the "box" (division).
#3: change the name of your division here
#2: select the <div...> tag
You can edit the id just like you'd edit any other class or
id by looking for it on DW's CSS window.
Some things you may want to set for your layers:
- On the box menu, you can mess with the padding,
background-color, and all the other box-ish attributes
that you already know about.
- On the positioning menu, you can set the z-index,
which determines which layer is on top (if several layers overlap). The
higher the z-index, the closer to the viewer in the stack of layers.
include "_i/3.h" ?>