Using Layers in Dreamweaver MX 2004

by Jeremy Reis on Wednesday, November 29, 2006

Using Layers in a Document

Unlike tables, layers let you stack objects, overlapping them as needed without sacrificing the ability to position elements with precision. You can also control the visibility of layers, as well as their appearance and position on the page, using cascading style sheets. This flexibility makes layers a far more powerful choice for page design than tables.

To add a layer to a page:

  1. On the Insert bar, make sure the Layout category is selected and click the Draw Layer button.
  2. Click and drag the mouse to draw a layer on the page. The layer acts as the container for an element you add to the page, such as text, a button, a graphic or a Flash movie file.
  3. If necessary, you can reposition the layer by dragging it with the mouse, or by entering values into the L (Left) and T (Top) fields of the Property Inspector.

Tip:

Turning on the grid can help you position layers exactly where you want them: Open the View menu and select Grid, and then Show Grid. A grid appears over the document. In the same menu, select Snap To Grid to help you align a layer precisely to the lines. As you near a line in the grid, the layer "snaps" into place.

  1. You can resize the layer in the same way you reposition it: either click and drag one of the selection handles at the edge of the layer, or enter specific values into the W (Width) and H (Height) fields.
  2. Use the Property Inspector to define additional properties for the layer, including background image, background color, visibility, clip, and overflow. Clip specifies the visible area inside the layer; that is, if you want only a small portion of the contents of a layer to be visible, define the visible area by entering left, right, top and bottom coordinates (in pixels). Overflow specifies how the layer should appear when the contents exceed the size of the layer. You can choose whether or not the extra contents should be hidden or visible, or whether or not to include scroll bars.
  3. Enter a name for the layer into the Layer ID field. Naming layers helps you manage them later, using the Layers panel.
  4. Once you've set the properties for a layer, insert the element it will contain using the buttons on the Insert bar. You can insert a graphic, a Flash movie - even a table. To insert text, simply type the text directly into the layer and format it as usual.
Page 48 of 60

Comments

 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
first web site
howdoi make a web site
355 out of 634 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
Need this programm for me
Thanks
310 out of 563 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
my comment
it is very helpful for my groath.thanks sir.
287 out of 529 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
Backgraound image
How do i make a background image in my web page with out it being repeated over and over again - Lydia
271 out of 490 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
TANX ALOT...
TANX ALOT... I'LL TRY THIS TUTORIAL SO THAT I CAN BE PRO IN DREAMWEAVER,,,, BUT IS THERE IS A VIDEO TUTORIAL... IT;S WILL MAKE ME EASY... LEARN WHILE WATCHING THE TUTORIAL... :)
263 out of 474 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
wasana
very good
240 out of 463 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
Thanx
It really helps me very much thank you once again
236 out of 438 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
comment
very good
270 out of 497 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
...
nice
233 out of 423 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
very nice
very nice
228 out of 422 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
coding
how make transfer for s students which score 150 above to choice of school
219 out of 403 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
camron
computer wooter hooter like gooder scooby dooby do where r u we need help from u dipset
228 out of 405 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
cool
this is awesome
201 out of 372 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
hes
my classmate
198 out of 358 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
Ruler OF All
Shuffling is for fat crawling bags of phlegm
198 out of 368 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
view
i found all the articles in learthat very informative but it lacks some emphasis on using databases
178 out of 303 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
cool n keep it up
whateva you guys do is owesome,coz it helps the under previledged.thanx
164 out of 297 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
Thanx
Thanx Macromedia Dreamweaver becomes easy for me
Thank u very much once again
158 out of 294 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
bravo!
this is unique information for web designers
136 out of 245 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
For Help
Thanks to learn to my First user
114 out of 211 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
I am cool
113 out of 200 people found this comment informative.
 Rate This Post:    Rate This Comment as Good Rate This Comment as Bad
Great tutorial!
Finally getting started with Dreamweaver. Discarded the big books, this is lots better! Thanks!!
99 out of 188 people found this comment informative.

Add a Comment to This Article

Anonymous (Please Login to Post With Your Account)

      
HTML not permitted, some code allowed in [brackets]:
[b]bold[/b] , [i]italicized[/i], [br] line break, other formatting...


Code Image - Please contact webmaster if you have problems seeing this image code Load New Code
Please enter the code above
 
Please submit your comment only once, some comments may be reviewed by moderators
That Network: Interactive Internet Publishing Network DefineThat.com: free technical definitions define wordsExamPractice.com: free certification news and practice exams   Explorestartups.com: find free business plans and business ideas   GiveThat.com: free gift ideas, birthday, Christmas, holidays  helpthat: got questions, we got answers   Jerm.com: entrepreneurship blog   learnthat.com: free software tutorials  mytutorials.com: collaborative write your own tutorials  Publishondemand.net: free publish on demand print on demand pod comparison   Romancetips.com: free romantic tips, advice, dating, date ideas, free romance   seekthat: free technical search engine   selfpublishthat: publish on demand   startupwatch: profiles of new companies   thatgear.com: gadget and electronic reviews   thatlead.com: sales leads and company profiles   tutorialguru.com: free tutorials