Hyperlink of Dreamweaver MX skills in practice

Source: Internet
Author: User
Tags tag name dreamweaver
After the previous operations, our webpage has already been illustrated and illustrated, which has a considerable effect, but this is not enough for the webpage, in order for many webpages in a website to become an organic whole, each webpage must be linked through a hyperlink so that viewers can jump between different pages.
I. LINK images and text
It is very convenient to create links for some text or images. You only need to use the mouse to select the image or text to be linked, and then enter the target page address to jump to in the "Link" input box on the property panel, or press the folder icon next to the input box to select the file to jump. In addition, Dreamweaver MX 2004 provides a method to quickly link files through website windows.
Step 1: First run the "Site> Manage Sites" command and select a Site that has been created from the pop-up menu. You can see the Site management window on the right.
Step 2: Select a text or image in the editing area and drag the circular target icon next to the "Link" input box on the property panel. An arrow appears, when the arrow points to a file in the website manager, a box appears around the file (as shown in Figure 1 ).

Step 3: after you release the mouse, the lower part of the selected text will be underlined, and the color of the word will change to blue, and the address of the target file will be automatically displayed in the "Link" input box.
Tip: Pay attention to the two URL methods when creating a link. 1. Absolute address: for example, www.abc.com/test.htm=2.relative address: for example, download/1.htm, the page 1.htmis in the root directory of the server.
2. Set multiple links on an image
Some web pages have multiple links on a large image, so that visitors can click different locations of the image to enter different pages. This applies the concept of the image hot zone, we can follow the steps below to achieve this.
Step 1: In Dreamweaver MX 2004, you can select an image first. In this case, you can see a "Map" area on the image attribute panel, with three pale blue Tool icons under it, that is, rectangle, circle, and polygon.
Step 2: Select one of them with the mouse as needed, and move the mouse over the image to drag a pale blue area.
Step 3: In the "Link" input box on the property panel, fill in the webpage address to be linked, so that an image hot zone is ready.
Similarly, you can set multiple image hot regions for this image so that you can click different areas of the image to enter different pages.

3. Customize the link to jump in the page
If you frequently Subscribe to free e-magazines online, or browse ultra-long pages, you should be familiar with this label link. This is a list similar to a directory to easily jump to any part of the page.
Step 1: In Dreamweaver MX 2004, first determine the position to which the link points, that is, the position to stay after the screen jump, then select the target text and run the "Insert → Named Anchor" command.
Step 2: Enter the tag name (such as test3) in the "Anchor name" text box ), in this case, an anchor Mark is automatically displayed under the text to differentiate common text content (see figure 2 ).

Step 3: Enter "# test3" in the "Link" input box of the property board. test3 is the name you just set, so that you can implement the page jump function.
Tip: If you want to point to a location on another page, you can just drop the anchor mark.</

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.