Clever use of DW for web page production skills - Netizens who are familiar with web design know that there are many ways to call Style. We can right-click the mouse and select Custon Style to call the Style standard, or we can right-click on the element list in the status bar. to call Style. Although the effects achieved by different methods seem to be the same, the HTML codes actually generated are completely different.
1. Use styles flexibly.
Netizens who are familiar with web design know that there are many ways to call Style. We can right-click the mouse and select Custon Style to call the Style standard. We can also right-click the element list in the status bar to call the Style. Although the effects achieved by different methods seem to be the same, the HTML codes actually generated are completely different. For example, using Custon Style to call the Style standard will generate a <span> tag in the web page code. Too many such tags will make the file very bloated and affect the browser's parsing speed, so we should try to use elements in the status bar. List to call Style.
2. Make full use of the Format Table command
. In complex web design, tables are used the most, because tables can be used to freely control the specific positions of text and images on the web page, thus making the entire web page look compact and unified. Dreamweaver is not far behind in this regard. We can use the "Format Table" command to quickly apply pre-designed styles to the table. To use a pre-designed style, first place the cursor in any cell of the table, then select the "Command" → "Format Table" command. In the subsequent dialog box, select a design scheme from the list on the left . Press the "Apply" button to check the effect. If you are not satisfied, you can also reset or modify the values of some parameters, such as border thickness, background color, etc.
3. Link to two web pages at the same time.
We all know that a hyperlink can only connect to one page at a time. If we want to open the document in different frame pages at once, we can use the "Go To URL" JavaScript behavior. Open a framed web page, select text or images, and then select "Go To URL" from the Actions panel. We will notice that Dreamweaver displays all available frames in the "Go To URL" dialog box. Select one of the frames we want to link to and enter the corresponding URL, then select another frame and enter another URL.
4. Do not give the file a Chinese name.
After you create a web page, you usually give the web page a representative Chinese name. Firstly, people can roughly understand the content of the file by looking at the file name. Secondly, It can facilitate mutual calls between various hyperlinks. But if you do this in Dreamweaver, you will find that Dreamweaver does not support Chinese file names very well, and incorrect page calls often occur. Therefore, when we save web pages in Dreamweaver in the future, try to use English or numbers. As the file name, this can avoid the above error phenomenon.
5. Cleverly set the font resolution.
When we are making web pages, we often have this experience, that is, the created web pages are normal when browsed on the local computer, but when browsed on another computer, the original beautiful web pages become It’s weird, why is this? It turns out that the resolution of each computer is to ensure that your homepage can be displayed normally at different resolutions, which has been better solved in Dreamweaver. In the lower right corner of the document window, Dreamweaver displays the resolution size for which the current document is designed. Click on which number, you can specify the display resolution for the current page in the pop-up menu, and you can make your homepage more flexible by modifying it. So that monitors with different resolutions can display better.
6. Cleverly hide tags.
If an invisible element is inserted into a web page, Dreamweaver will automatically add a corresponding element tag to the page so that we can select the invisible element. But this is not always a good thing. For example, if we insert a table in the first row of a page with many layers, we will find that the table automatically retreats to the first row of the page because there are too many layer element tags arranged in the first row. The second line, although it does not affect the effect when browsing, it will indeed hinder our work. So when we feel that an element label is intrusive, we simply block it. The method is to press Ctrl+U to open the Preferences panel, select Invisibel Elements in Category, and all element labels will appear on the right side of the panel. As long as you remove the check mark in front of the unnecessary element tag, it will be guaranteed not to appear again in the future.
7. Make good use of drag-and-drop techniques.
When we use Dreamweaver to edit web pages, we often need to insert some images. If there are many images to be inserted, it will be very troublesome to operate according to the conventional method. We can use drag and drop techniques to solve this problem very well. First, we turn Dreamweaver's operation window into an active window to free up space to display the Explorer window. After finding the image files to be inserted, drag them one by one to the appropriate part of the web page with the mouse, and Dreamweaver will automatically insert these images. The URL of the image is added to the HTML code of the file. Of course, the dragged image file must be a web image format file such as gif, jpg, etc. The same goes for images that are already on the web page, just drag them over. But if there is a hyperlink on the dragged image, you can no longer use the dragging technology, because then only the hyperlink address is dragged over.
8. Automatically set the update time.
We know that if a web page wants to get more repeat visits, a very important thing is to constantly update it. But for our personal web pages, it may not be easy to update them in time every day. Therefore, we hope that the web page can be updated automatically. The author below will provide a source code that can automatically update the modification time. We only need to add this source code to...< /BODY> to achieve the purpose of updating the time:
< Script Language="JavaScript"> </script>;The second is to click Text/Custom Style/Edit/Style Sheet/New/Redefine HTML Tag in Dreamweaver with the mouse, and select a from it, then select none in decoration, and finally Click OK and you're done.
12. Cleverly copy text.
Copying text between several different applications is something we may often do in actual work. However, if we copy the text in the editing area from Dreamweaver to another application, the HTML code and text will be copied together. So how can we copy only the text in the editing area? We know , usually use the shortcut key Ctrl - C to operate when copying. If we press one more C key when copying, Dreamweaver will only copy the selected text.
13. Make good use of shortcut keys
. In order to improve the efficiency of operations, we can use shortcut keys in Dreamweaver, such as using Ctrl-B or Ctrl-I to apply bold or italic format to text. You can also use the following keyboard shortcuts to select The text applies HTML format: Ctrl-0: Unformatted Ctrl-T: Paragraph Ctrl-1: Heading 1 Ctrl-2: Heading 2 Ctrl-3: Heading 3 Ctrl-4: Heading 4 Ctrl-5: Heading 5 Ctrl-6 : Title 6
14. Automatically close the web page.
If we want our web page to automatically close within a specified time, we might as well add the following code after the tag in the web page source code: < script LANGUAGE="JavaScript"> </ /script> where the code The 3000 in means 3 seconds, which is measured in milliseconds.
15. Set object names cleverly.
When we use Dreamweaver to create very complex effects, we may need to use one or more objects repeatedly. For example, we often need to locate a specific table, image, etc., if we do not If you name multiple objects in a web page, it may be troublesome or error-prone when using these objects repeatedly. In order to facilitate calling these objects, every time we create a new object, we should remember to give it a representative and easy-to-remember name. When naming these objects, we can just do it through the object's "Properties" panel.
16. Add dynamic effects to image links.
Sometimes in order to achieve a realistic effect, we hope that there will be movement when the mouse moves over a link. This effect can be easily achieved using Dreamweaver. When designing, we first need to prepare two images, the first is the original image, and the second is the image after the mouse is moved up. Then click the first picture with the mouse, fill in the file to be linked in the link column in the properties panel, then click the F8 key on the keyboard, click the "+" sign in the pop-up Behaviors window, and then select " swap image", select the second image in the window that appears, and finally click OK.