DreamweaverFAQ.com
Search the site!Search DWfaq.com | Print This PagePrinter Friendly Page
Current: Default | Default: Pacifica


DreamweaverFAQ.com » Tutorials » Frames » Creating Framesets In Dreamweaver - Page 3


Creating and Managing Framesets in Dreamweaver

What We Have Done

To sum up what we have done so far...

  • We have created a Frameset
  • Named all of the Frames
  • Saved the Frameset and all of its Frames .htm files
  • Resized the Banner and Navigation Frames

The frameset.htm will not need any further work at this point. It's job of containing the other three is done.

Setting the Properties of Each Frame

You are ready to define each frames basic properties and start adding content to the .htm pages inside of them.

In the Frames Panel, click into the NavFrame area

propInspFrames3.gif

The Property Inspector changes, displaying a few different options. The Frame Name (NavFrame) is identified.
We have used the settings above for this tutorial.

Scroll

  • Yes (displays scrollbars)
  • No (does not display scrollbars)
  • Auto (displays scrollbars as needed)
  • Default (most browsers display scrollbars as needed)

NoResize

If checked the user can not resize the frame. If unchecked it can be resized with the users mouse

Borders

  • Default (most browsers display borders)
  • Yes (displays borders)
  • No (does not display borders)

Src

Displays the .htm file that occupies this particular Frame. You can change this at anytime.

  • Margin Width
  • Margin Height

You can set the page Margins here. This is the space at the top and left of the frames window usually defaulted at 10px. There are other methods to set these including using stylesheets. For this tutorial we will use the Page Properties dialog box.

Below are the settings used in this tutorial for the other two frames

The ContentFrame
propInspFrames5.gif

The BannerFrame
propInspFrames6.gif

Setting More Properties of the Pages (.htm files) inside the Frames

Let's set some of the properties of each .htm file to make the different frames distinguishable from each other when viewed in a browser.

  1. Place the cursor in the NavFrame area (on the actual page - not in the Panel)
  2. Modify » Page Properties (The Page Properties dialog box will appear)
  3. Change the Bg color to a dark gray color (we used #666666)
  4. Set all 4 Page Margins to 0 (zero)
  5. Give the page a title (Remember only the title of the "Frameset" will appear in the browser title bar)
  6. Click OK
  1. Repeat these steps for the BannerFrame area. Set its Bg to another color (we used #669999)
  2. Do the same for the ContentFrame's .htm file but leave the Bg set to white (#FFFFFF)
  3. File » Save All Frames and then press F12 to preview in a browser.


Here is what you should have so far.

screenshot1.gif

::This page last modified 8/13/2013 at 04:37::

Copyright © 2001-2024 DreamweaverFAQ.com All Rights Reserved.
All brands, trademarks, tutorials, extensions, code, and articles are the property of their respective owners.
A production of Site Drive Inc.
Legal Notice | Privacy Policy | Disclaimer & Notice