Dreamweaver 4 concise tutorial (2. Preliminary understanding of Dreamweaver)

Author：Eve Cole Update Time：2009-05-30 18:36:17

2. Initial understanding of Dreamweaver

Dreamweaver startup

The installation process of Dreamweaver is very simple. Once installed successfully, you can find the Dreamweaver option in the start menu:

Edit window

When you start Dreamweaver for the first time, the first thing you see is the Dreamweaver editing window. Don’t be intimidated by the dense floating windows above. In fact, the most commonly used ones are the following:

① Main menu: Most functions of the editing window can be found here;
② Toolbar: It is a new feature of Dreamweaver4;
③ Object Panel (Objects): During the process of editing the web page, click the button of the Object Panel to add corresponding elements to the web page, such as pictures, tables, layers, and Flash. We call these elements objects. Click the downward arrow on the object panel to insert other types of objects, such as special characters (Characters), forms (Froms), etc.

④ Properties panel: used to display the properties of the selected web page element and can be modified on the properties panel. When you select different web page elements, the content displayed in the attribute panel is also different. For example, the attributes displayed in pictures and tables are different. In addition, click the small triangle in the lower right corner of the property panel to shrink or expand the property panel according to the needs of use. It is recommended to set it to expanded mode under normal circumstances.
⑤ Panel group (also known as dockable floating panel): Dreamweaver also has many, many other floating panels. We can recombine different floating panels according to our own preferences. This is the so-called panel group. In Photoshop, there is a similar concept.
⑥ Quick launch bar (also called launch panel): a floating panel used to show or hide responses. Launch panel and mini launch bar in the lower right corner

One-to-one correspondence; among them

is to switch to site manager,

is to switch to the behavior panel,

is to view the source code of the web page.
⑦ Editing area: Display the content of the edited web page in a "What You See Is What You Get" manner:

[Tip 1] If the position of the floating panel on the screen is too messy, or even exceeds the desktop range and is inconvenient to operate (this is especially likely to happen after changing the resolution of the monitor), you can select "Window >" in the main menu. Arrange Panels" automatically rearranges floating panels.

[Tip 2] The following are several commonly used hotkeys for quickly opening and closing floating panels. Remember them because they will be used frequently during the production process:

Properties panel: Crtl+F3
CSS Styles style panel: Shift+F11
Behaviors behavior panel: Shift+F3
Objects object panel: Crtl+F2
site window

The site window is another important window of Dreamweaver. The left half is the directory of the remote site, which is generally displayed as empty. The content is only displayed when FTP is connected; the right half is the local directory currently being edited. Isn’t it a bit similar? windows explorer? Yes, the function of the site window is actually to intuitively and conveniently allow you to manage your site like files on your hard drive.

In the process of creating web pages in the future, you will frequently switch between the editing window and the site window.