When coming across a web page that has a good length and consists of many contents, you will find there are always some buttons such as “back to the top”. What is this? How can we achieve this impact? Yeah, it is a named anchor. Named anchors let you set markers in a document, which are often placed at a specific topic or at the top of a document. You can then create links to these named anchors, which quickly take the viewers to the specified position. Now, follow the following steps you also can make it.

www.DoNotYet.com 20091019000 Dreamweaver 8.0 Tutorial ---- The Creation of Named Anchor

Step1:

Place the insertion point in the document where you want the named anchor to appear. Select Insert-Named Anchor command, and open the Named Anchor dialog box. Put “1” into the Anchor name textbox. Click OK, inserting the named anchor.

Or you can click the Point-to-File icon to the right of the Link text box in the Property inspector and drag it to the anchor you want to link to: either an anchor within the same document or an anchor in another open document.

www.DoNotYet.com 20091019001 Dreamweaver 8.0 Tutorial ---- The Creation of Named Anchor

Shift-drag in the Document window from the selected text or image to the anchor you want to link to: either an anchor within the same document or an anchor in another open document.

NOTE If you don’t see the anchor, select View > Visual Aids > Invisible Elements to make it visible.

www.DoNotYet.com 20091019002 Dreamweaver 8.0 Tutorial ---- The Creation of Named Anchor

Step2:

Select the top text or image. Put “#1” into the List textbox, setting the link.

www.DoNotYet.com 20091019003 Dreamweaver 8.0 Tutorial ---- The Creation of Named Anchor

Step3:

After creating the named anchor, you can set the link color, rollover links, visited links and active links in the Page Properties. As the following picture showing:

www.DoNotYet.com 20091019004 Dreamweaver 8.0 Tutorial ---- The Creation of Named Anchor

Step4:

Save the html you designed. Press F12 to preview the impact. The first picture is the original web page, and the second one is after pressing the “back” link.

Pic1

www.DoNotYet.com 20091019005 Dreamweaver 8.0 Tutorial ---- The Creation of Named Anchor

Pic2

www.DoNotYet.com 20091019006 Dreamweaver 8.0 Tutorial ---- The Creation of Named Anchor

Finally, a named anchor is created. In a web page, you can have some named anchors. Generally speaking, named anchor should be used as few as possible, but when you need to link to a specified position, don’t hesitate to use it.

Related Posts