Creating frames based web page with Dreamweaver

10:34 AM Posted by BlogTechno

Frames allow you to divide a page into parts and display certain information, such as a navigation bar or a table of contents, at all times. Frames are really "pages within a page"; you specify which pages are visible in which frames. In Dreamweaver 3, once you create a frames-based page, you can either add content directly to the empty frame or import an existing page.

Creating a Frames-Based Page

Step1:Start Dreamweaver and locate the Objects palette.

Step2:Click on the downward pointing arrow next to the palette's visible section (usually Common) and choose Frames.

Step3:Select the type of frameset (frame layout) to be used from the options listed.

Step4:Click on one of the empty frames to begin inserting content into the frame.

Step5:When finished, choose Save from the File menu to save the frame. Give the frame an appropriate name, such as topframe.html or sidebar.html, for easier editing later on.

Step6:Choose Frame from the Window menu to open the Frame Inspector. Use the Frame Inspector to make changes to the frame, adjusting such aspects as width, height and border thickness.

Using Existing Pages as Frames

Step1:Make sure the Frame Inspector is open. In the Frame Inspector window, click on the frame where the existing page will be located.

Step2:Open the Properties palette by opening the Window menu and selecting Properties, or by pressing Ctrl+F3.

Step3:Locate the Source (SRC) field and type the name of the file to be used in the frame, or click the Folder button to browse your hard drive for the file.

Step4:Make any other formatting changes to the frame, then click on another frame in the Frame Inspector window to insert a file or add content directly.

Step5:When finished, save the frames-based page by selecting Save All from the File menu. If you haven't made any changes to the pages themselves and only want to save the frameset, choose Save Frameset from the File menu.

Step6:Preview the page by choosing Preview in Browser from the File menu.

Related Posts :



0 comments:

Post a Comment