Dreamweaver Skills 12 Strokes

dreamweaver| Tips for professional web-page makers who want to make complex Web pages in a visual environment, Dreamweaver has grown into the web-editing tools market, becoming the best choice for professionals to write Web pages. In the present situation, the Dreamweaver function can be said to be more and more, more and more rich, complete. Here I would like to introduce you to the 4.0 version of some of the application tips.

1. Make page page more flexible
Some Web developers say the following techniques are liquid, and I call this technique a stretchy (elastic extension technique) here. This is a trick, you can change the size of the visitor's browser window to adjust the page size, so if the window is too large there will be no space, the window too small edge will not run up and down moving bar. In fact, most simple Web pages will be the size of the browser window to adjust the size of the page, but if the page used a lot of different boxes and tables, page size is difficult to automatically adjust the page. Typically, web designers design page pages with a mix of fixed bar widths and GIF files, so that the page size will be fixed and not run, whether it's Internet Explorer or use. With Dreamweaver 4.0, it is easy to design a Web page that will automatically adjust flexibly. How do you do it?
Open the page with a button on the tool surface (Object palette) and convert to format view (Layout view). You can see the column width of the text box, and a small drop-down arrow in the middle of each column, select the small arrow above the column that you want to flex the display on, and then select "Set the Columns to Flex" (Make Column Autostretch). (set to automatically adjust the column width to one column) a wavy line appears above the column box, rather than a number that originally represented a column width. Dreamweaver will automatically create a fixed layout of the space map file, the blank image file is the top of the column of two long blank form, so that the layout will automatically be filled, will complete the flexible layout settings. (The first time you add a blank map file will jump out of a dialog box to ask you if you want to use the built-in map, for the effect, I suggest you let Dreamweaver automatically produce a, or you do not use a blank map file to fill the layout.) ）

2. Create personalized palette
Dreamweaver 4.0 New Assets Panel (property Control Panel) is a new tool that can be used to manage files based on file patterns, such as pictures, templates, etc. when you are editing a Web site (select Site when you define a new platform). New Site, all types of components are automatically added to the appropriate table box in the Asset panel. This addition to the new Assets Panel Property Control Palette also has a color box that stores all the colors used in your site, including the color of the text, the color of the background, and the color of the links. This is a user-tailored web site-oriented color plate. Just Activate Assets panel (select window First Choose Assets), and then choose the left little color scroll bar, you can see a variety of color options on your site. Of course you can pull these colors into certain selected text. Even when you choose a color, the image will appear on the color of the hexadecimal value of the color shading, and three-color corresponding code (RGB). If you want to shrink the palette toolbar a little, you can even add some colors to the palette's favorites. All you have to do is reverse the selected color, select a window called Add to My Favorites button (bottom right button).

3. Make pop-up menu navigation system
to make a pop-up menu navigation system (pop-up menu navigation system) uses some of the JavaScript syntax techniques, but if you're faking dreamweaver/firework S Studio, quickly and easily. First start in Fireworks, select a picture, and then select Insert in the dialog box of Set pop-up menu Pop-up Menu, you can enter the item name and select the Plus button to add the item. You can continue to make a fine setting in the pop-up message box, such as setting the text and links you want to use for the item, and, of course, adding a submenu and rearranging the settings for the next level. When you are done, select Next and continue to set preference values such as colors, fonts, and so on. When the menu is complete, you can preview the HTML syntax and preview the image. Then choose Finish (Finish). When the mouse moved to the original pattern, the menu system will appear in the list of contents. When the file is then remitted, Fireworks automatically produces all the HTML, JavaScript, and video files that Dreamweaver needs to use.

4. Let the picture file Move!
If you have Dreamweaver/fireworks Studio installed at the same time, the perfect mix of these two products will make you full of praise. Even if you are not a professional graphic designer, in the design of the Web page also more or less want to modify some GIF image files vivid. Dreamweaver can make you make animation do not beg for help! Select the picture you want to modify in the standard window, and then select the Edit button in the property Inspector. If you install a Dreamweaver with fireworks, fireworks is the Dreamweaver preset picture editor, and the picture is automatically loaded into fireworks. (If you look carefully, you will find that Fireworks will appear in the text and patterns Editing from Dreamweaver, indicating that you can be edited by the Dreamweaver.) OK, now in Fireworks select the picture you want to edit, select Modify Animate Animate Selection. Next completes the Animate dialog box The setting, chooses the animation the frame number, the animation movement direction, the transparency and so on sets. You can also choose the Frames toolbar to set the moving speed and select the Object version to change the setting. To export the file, simply select the Optimize toolbar and select animated GIF where the file type is. When you're done, Fireworks will automatically remit the picture to an optimized setting, automatically updating the GIF file, and will show the updated image in the Dreamweaver. Select File Preview in Browser, so you can preview the cute file you just made in the browser!

5. Let the button have a flashing effect
In Dreamweaver, there is no flash program, you can also make Flash button objects with flashing effects. The 4.0 version has several Flash button objects, which can be used to make several different forms of buttons. Select Insert Interactive Images The Flash button will see what built-in buttons are available. In the dialog box you can even use the mouse to point to the form of the button you want to use, and then see how it works in the browser. Use the mouse cursor to select the form of the button to use, and then enter the parameters, such as the button on the text, font style, color, link, etc., or custom file name. Press OK. Then a SWF file will be generated and the file will be automatically placed in your Web page. Click on this good file, you will see the property Inspector (attribute details) will show the properties of the file. When the file attributes show up, if extended file attributes list, will appear play (playback) button, after the selection can not open the browser to pre-view button flashing effect.

6. Making Mobile Text
Adding mobile Text to a Web page is as easy as adding the Flash button I just introduced. In the same way, without installing Flash, the new features provided with Dreamweaver 4.0 can be easily done. Web page makers with HTML syntax and no interactive media experience can easily create compact Flash-style streaming text. According to Macromedia, 97% of Web users can watch Web pages with Flash effects, so this new feature can add a bit of interactivity to the Web page without adding compatibility headaches. Select Insert Interactive Images Flash text, and then fill in the preferences one by one (for example, text, font style, typeface color, font size, and so on) that you want to change the effect.

7. Change the keyboard quick key
Dreamweaver allows users to customize the interface, this design is very flexible. For example, a user can make a re-election order by writing a program (programming) or by adding objects (object) on its own. Instead of being sophisticated, you can change the keyboard shortcuts because Dreamweaver has a graphics interface called keyboard shortcut editor, just select Edit Keyboard shortcuts, the dialog box will load and list the quick keys that can be changed, allowing you to change the quick key to your custom set value. To change the quick key, just use the Drop-down menu of the current set and command column (command) to find the instructions in the existing instructions that you want to make, and then select the current Quick key, which will appear in the list of quick keys. In addition, to increase the speed key setting, you can select the Plus button, typing the new quick representation you want to use on the keyboard, and select Change. You can also select a quick key, select the Remove key (minus), and you can remove a quick key.

8. Reset the column width of the website window (Site window)
Just select View from the Site window The File view Columns allows you to customize the size and rendering of the column width when you view the site view. Select a column-wide name, use the up and down arrows to resize it, or uncheck the Display field (show field) to hide the column. Alternatively, select the Plus button to add a column and create a column name. Alternatively, you can use the Drop-down menu to select the existing note to relate the column to the design note.

9. Read the page original file
When you open O ' Reilly Code Reference (Window Reference) to check the properties or browser compatibility, the preset window will display a reference setting with a small font size. But if you press the right portals at the top right of the window (just below the Close button), you will see a row of Drop-down menus where you can choose the size of the original file font (small word, medium font, and large font). Choosing a large font comparison does not abuse your eyes, because you don't have to look at the screen with a magnifying glass when you look at the HTML original file!

10. Add Flash button
on top I've taught you how to use the 20 preset button types to make Flash buttons in Dreamweaver. This is a way of not having to install any other files or programs. Another way to do this is to install fireworks buttons, which has the same effect as five tricks. To the exchange for Dreamweaver (Dreamweaver expansion function Switching center), enter the keyword search for the instagraphics Extensions for Dreamweaver, and then download the 577K file. Convert to Dreamweaver, select commands Manage Extensions, then choose File Install Extension, you can start the installation. Once the Dreamweaver is reactivated, there are six novel and interesting button patterns, including surfboard and Bulletbar, when using insert Interactive Images Fireworks button command, you can create a cool buttons. You can also use commands Convert bullets to Images and commands Convert Text to Images, both of which can be used to automate Fireworks.

11. Add the "Set as Favorites" feature to your Web page
Search in exchange and you'll find the Add to favorites extension. This small file accounts for 3K, download time will not wait too long, then follow the same steps, loaded by Extension Manager (Commands Manage Extensions, File Install Extension). Then reactivate Dreamweaver, the newly loaded expansion file will add a feature to the Dreamweaver. If your Web page adds this "Add Favorites" feature to your Web site, you can easily add your site to his browser's favorites (or personal bookmarks) when you click on it. In addition, you can customize the Favorites shortcut name, as well as the favorite shortcuts before the name will appear in the small icon (general ie in the Favorites folder shortcuts in front of the small icon is the default value of IE, if you have their own design of the small icon, it is much cooler.) Note that this feature only supports browsers with IE 4.0 and later. You can easily activate this cool feature simply by selecting the behavior face version of the Windows menu and then selecting this feature from the IE drop-down menu.

12. Super Cool chart
If you want to make a form, do you want to take the time to beat the original code verbatim? No need, already have ready-made! To exchange download form Builder extension, there are ready-made forms that let you immediately copy field tables that include countries, sex, marital status, age level, and other categories. Go to Exchange to download this small (only 11K) file and install it via Extension Manager (commands Manage Extensions, File Install Extension). Then just reactivate Dreamweaver and select Insert Formbuilder, it will be in (insert Extension file found in Formbuilder). When you choose, a dialog box appears, showing all the formatting menus you can apply.

Turn from: Dynamic Network production guide www.knowsky.com