The layout
mode is a fast and easy way to setup the underlying
structure of your pages. In this tutorial
we will construct a simple page from start
to finish using the Layout View that will
work in all browsers. If you prefer to skip
to a specific topic, you can use the Quick
Links feature to jump around as needed.
You can download the images
I created for this lesson to help you follow
along more easily, or you can download the
complete tutorial including the images for
offline viewing. Download imagesDownload complete
Open a new document.
File>NewGo to Modify>Page
Properties and set all four Margins to "0"
From
the objects pallette select first the Layout
View icon and then
the Draw Layout Table
icon. Place the cursor
towards the top of the screen and draw a somewhat thin
table from left to right.
Don't worry about the dimensions right now. We will
learn how to move and resize the tables later in this
tutorial.
* Dreamweaver automatically aligns
this first table flush to the top and left margins of
the screen
The Objects Pallette
Now we will add additional tables.
For each additional table or cell
you wish to draw you must click on the corresponding icon
first. Click theDraw Layout Tableicon.In the white space below
the table you just drew, draw a fairly largetable that almost fills the
rest of screen. Then draw another table inside of this one
towards the left, then another one inside of this one. Remember,
you must first click the Draw
Layout Table icon to add additional
tables.
Now we have a single detached table spanning
the top for the banner, a larger table below with a nested
table inside of a nested table. These nested tables will be
used for navigation.