[Reprinted] HTML hyperlink (4)

Source: Internet
Author: User
Tags ftp file ftp site gopher ftp file transfer ftp file transfer protocol ftp protocol

Chapter 4 Create a hyperlink to download materials

One of the most important applications in HTML files is hyperlinks. hyperlinks are the soul of a website. Web pages are linked to each other. You can click a text or image called hyperlink to link to other pages. Hyper-text links can be used to link relevant files. This type of super-link operation is called a hyperlink. In addition to linking texts, Hyperlinks can also link various media, such as sounds, images, and animations. With these hyperlink, we can enjoy the multi-media world.

Create a hyperlink label as <A> and </a>

Format:<A href = "resource address" target = "window name" Title = "text pointing to connection display"> hyperlink name </a>

Note: The tag <A> indicates the start of a link. </a> indicates the end of The Link;

The "href" attribute defines the target address referred to by this link. The target address is the most important. Once an error occurs in the path, the resource cannot be accessed.

Target: This attribute is used to specify the target window for opening the link. The default mode is the original window.

Create properties for the target window

Attribute Value

Description

_ Parent

Open in the upper-level window. Generally, frame pages with shard shards are frequently used.

_ Blank

Open in new window

_ Self

Open in the same region or window.

_ Top

Open in the entire window of the browser and ignore any framework

 

Title: This attribute is used to specify the title text displayed when it points to the link.

"Hyperlink name" is the element to be clicked to link. An element can contain text or images. The text is underlined and different from other text colors. The Graphic Link is usually displayed with a border. When linking images, you only need to embed the logo of the displayed image between <a href = "url"> </a> to achieve the effect of image linking. When you point to "hyperlink name", it becomes a hand-shaped object. You can click this element to access the specified target object.

4-1 link path

Each file has its own storage location and path. Understanding the path relationship between a file and the file to be linked is the root of creating a link.

The Chinese name of URL (Uniform resourc Locator) is "Uniform Resource Locator ". The address that each website has. Each webpage under the same website belongs to the same address. When creating a webpage for a website, you do not need to enter a full address for each connection, we only need to determine the relative path relationship between the current document and the root directory of the site. Therefore, links can be divided into the following three types:

  • Absolute path
    Such as: http://www.sina.com.cn
  • Relative Path
    For example: News/index.html
  • Root path
    For example: D │/web/news/index.html

1. absolute path

Absolute path: contains all information required to identify files on the Internet. The file link is relative to the original document. Including the complete protocol name, host name, folder name, and file name

The format is: Communication Protocol: // server address: Communication Port/file location.../file name.

Lnternet follows an important protocol and Hypertext Transfer Protocol. HTTP is the Client/Server protocol used to transmit web pages. When the browser sends a webpage request, this Protocol establishes a connection with the server. after the link is opened, the server will find the request page and send it to the client. After the information is sent to the client, HTTP will release the link. this allows the Protocol to accept and serve a large number of client requests.

A Web application is a collection of static and dynamic resources on a Web server. A Web server is responsible for providing services to browsers.

Www.sina.com.cn is the host name of the resource. Generally, the default port number 80 is used. The Resource Name Is index.html in the web folder of the WWW server host ..

Example: http://www.163.net/myweb/book.htm (this web site is assumed)
Indicates that the "book.htm" file in myweb is used from the directory on the server named www.163.net over HTTP.

2. Relative Path

The relative path uses the path of the current file as the starting point to search for the relative file. A relative URL does not contain the protocol and host address information, indicating that its path is the same as the access protocol and Host Name of the current document, and even has the same directory path. Generally, only the folder name and file name are included. Only file names are supported. You can use a relative URL to point to a file on the same server or in the same folder as the source document. In this case, the target file linked by the browser is in the same server or folder.

  • If you want to link to the same directory, you only need to enter the name of the file to be linked.
  • Link to the files in the lower-level directory. You only need to enter the directory name, then add "/", and then enter the file name.
  • To link to a file in the upper-level directory, enter "../" and then the file name.

Relative Path usage

Relative Path Name

Meaning

Herf = "shouey.html"

Shouey.html is the file in the current local path

Herf = "Web/shouey.html" Shouey.html is a file named "Web" in the local current path.
Herf = "../shouey.html" Shouey.html is the file in the upper-level subdirectory of the current local directory.
Herf = "http://www.cnblogs.com/shouey.html" Shouey.html is the file in the two subdirectories of the current local directory.

3. root path

The root path directory address can also be used to create internal links. However, in most cases, this link is not recommended.

The writing of the root path directory address is also very simple. First, it starts with a slash, representing the root directory, then writing the folder name, and finally writing the file name.
If you want to write the drive letter in the root directory, use "│" after the drive letter, instead of ":", which is different from Dos.

For example:/web/highight/shouey.html
D │/web/highight/shouey.html

Maybe the reader will ask, should the relative path or root path be used when linking files on the local machine? In most cases, it is better to use relative paths. For example, if a link is defined using an absolute path and a folder is renamed or moved, all links will fail, in this way, you must re-orchestrate the links to all your HTML files. Once you move the clips to the Web server, there will be more to change, that is a very troublesome thing. The use of relative paths is not only suitable for local machine environments, but can be accurately linked by uploading files to the network or other systems without any changes.

4-2 hyperlink Application

4-2-1 bookmarks

A specific position in the Link document is also called a bookmarks. If the page is very long when you browse the page, you must drag the scroll bar to make browsing inconvenient. If the browser can read from the top to the end, you can also select a part of the reading you are interested in. This effect can be achieved through the bookmarkdoning link by selecting a target positioning point to create a positioning mark, use the value of the attribute name of the <A> tag to locate the tag name <a name = "tag name">. Create a link "title" for this target tag anywhere on the webpage. The name of the link created on the title must be the same as the location tag name, add "#" And <a href = "# locate Tag Name">. Click the title to jump to the content to be accessed.

The Bookmarks can be linked on the same page or on different pages. To link on different pages, you must specify the page address of the link and the bookmarks of the link.

 

Format:

  • Use the link address on the same page:
    <A href = "# bookmark name" target = "window name"> hyperlink title name </a>
  • Use the link address on different pages:
    <A href = "url address # bookmark name" target = "window name"> hyperlink title name </a>
  • Destination Address of the link:
    <A name = "bookmarkname"> Target hyperlink name </a>

The property value of name is the name of the position mark point of the target positioning point. It is used to name a specific position point (also called the anchor.

Example: 4-2-11html

<HTML>
<Head>
<Title> Tang poetry appreciation </title>
</Head>
<Body>
<A name = "TOP"> <H2> Tang poetry appreciation </H2> </a>
<A name = "LB"> <H2> Li Bai </H2> </a>
<A href = "# t.2" target = "_ blank"> three qingping accounts </a> <br>
<A href = "# t.1"> long trunk </a> <br>
<A href = "# t.3"> monthly discretion </a>
<HR>

<Br>
<H3> <a name = "t.2"> three qingping regions </a>

Think about clothes, <br> in Spring Festival, you can see them. <Br> if you are not in the Yushan region, <br> the event is sent to the zhutai region next month. <Br> one slogan is Lu Ningxiang, <br> Wu Shan Yu. <Br> who does it look like? <Br> you can lean on the neighborhood. <Br> the famous flowers and flowers are home to each other. <br> the King often smiles. <Br> there is no limit to hate in the Spring Festival. <br> Shen xiangting is leaning towards the north.

<H3> <a name = "t.1"> long trunk </a> <PRE>
When you begin, <br> before the flowers begin. <Br> Lang Xiaozhu Ma Lai, <br> Cheng Mei, a famous bed. <Br> cohabiting elders, <br> you can guess the two. <Br> 14. Jun, <br> shame. <Br> low-head to the dark wall, <br> different values may exist in different regions. <Br> I started to show my eyebrows at the 15th day. <br> I agree with the flood and gray. <Br> always store a column letter, <br> long shangwangfu. <Br>, <br> Qu Tang Yu heap. <Br> you may not renew your subscription on August 15, May. <br> you may lose sight in the sky. <Br> the first row of moss was created. <br> the first row of moss was created. <Br> you are not allowed to renew the product because it is too late in autumn. <br>. <Br> butterfly came in March August. <br> the grass was located in the western region. <Br> thank you for your patience. <br>. <Br> you will have your home in the morning and evening. <br>. <Br> you are welcome, <br> until Changsha.

</PRE>
<A href = "# Top"> Tang poetry appreciation </a>
<Br>
<H3> <a name = "t.3"> monthly discretion </a> <PRE>
For a drink, <br> click it if you have no friends. <Br> the bright moon is invited to the ghost cup. <br> three people are opposite. <Br> the month is hard to understand. <br> I am a shadow. <Br> This is a companion month shadow. <br> the row must be renewed and spring. <Br> I sang Yue Hui, <br> I danced for zero effect. <Br> when you wake up, you can get confused. <br> when you get drunk, you are dispersed. <Br> no conditions are lost. <br> the phase sequence is delayed.
</PRE>
<P> <a href = "4-2-12.html # Libai"> Li Bai despise privilege </a> </P>
</Body>
</Html>

 

Example: 4-2-12html

<HTML>
<Head>
<Title> Li Bai </title>
</Head>
<Body>
<Center>
<A href = "4-2-11.html # LB"> <H1 align = "center"> <font color = "#339933"> Li Bai </font> <Font color = "#339933" size = "+ 2"> Li Bai (701 ~ 762), <br> the word is too white, and the number is Qinglian jushi. <Br> Zuji chengji (qin'an county near Tianshui city, Gansu province), <br> he first rented a house in ciya for sin in the last year of Sui dynasty. <Br> Li Bai's home world and birthplace are still a mystery. <br> there are different academic opinions. <Br> Li Bai was born in the broken leaf city under the jurisdiction of Anxi Du Fu. <br> when he was five years old, he migrated his father to Qinglian Township, Changlong County, mianzhou. <Br>
<P> Li Bai has a strong temperament. <br> he loves the style of his family. <br> He loves Ren Xia and despise wealth. <Br> spent time in shuzhong in early years. His father is a rich businessman. <Br> Li Bai began roaming the country at the age of 25. <br> he traveled through Hubei, Jiangxi, Henan, Shandong, and other places. <br> </P>

<P> <a name = "Libai"> Li Bai despised privilege </a>. <br> it is said that he was drunk. <br> in front of Xuan Zong, Gao Lux gave him Boots. <Br> galnix thinks this is a great shame. <br> Yang Guifei is angered by Li Bai's poems. <Br> Yang Guifei blocks Xuan Zong from making Li Bai an official officer every time. <Br> Li Bai knew that Xuan Zong's cronies had opinions on him. <br> he begged to return home. <Br> Xuan Zong gives him his belongings and releases them. <br> </P>
<P> Li Bai is a great romantic poet in the Tang dynasty in China. <br> he is hailed as "Poetry Fairy ". <Br> his poems are magnificent and contain fantasies that break through reality. <Br> there were also reflections on the sufferings of people's livelihood at that time and attacks on political darkness. <Br> His prose is fresh and clear. <br> he is fluent. </P> </font> </center>
</Body>
</Html>

 4-2-2 establish a link within the site

Internal links refer to links between different HTML pages within the same website, determine which file is the master Link (that is, the current page) and which is the linked file. When we first introduced the link path, we have introduced the concept of internal links. The internal links generally use relative path links. The following shows the specific link method of the relative path:

Establish a link within the site

Current page Linked page Hyperlink code
2-1.html 3-1.html <A href = "3-1.html"> hyperlink elements </a>
3-1.html 1-1.html <A href = "ASM/1-1.html"> hyperlink elements </a>
Sy.html 1-1.html <A href = "SSM/ASM/1-1.html"> hyperlink elements </a>
2-1.html Sy.html <A href = "../sy.html"> hyperlink elements </a>
1-1.html Sy.html <A href = "http://www.cnblogs.com/sy.html"> hyperlink elements </a>
Sy.html 2-1.html <A href = "SSM/2-1.html"> hyperlink elements </a>

4-2-3 External links

An external link refers to the link between a jump to the outside of the current website and pages or other elements on other websites. Generally, the URL address of this link must use an absolute path with a complete URL address, including the protocol name, host name, path of the location on the host where the file is located, and the file name.

The most common external link format is <a href = "http: // URL">. Other formats are shown in the following table:

URL external link format

Service URL format Description
WWW Http: // "Address" Enter the World Wide Web site
FTP FTP ://"" Access File Transfer Protocol
Telnet TELNET ://"" Enable Telnet
Gopher Gopher ://"" Access a Gopher server
News News ://"" Start a news discussion group
Email Email ://"" Start email

4-2-31 link to other sites:

Links between pages and elements between sites are the key to information exchange on the World Wide Web. These links use the HTTP protocol to create hyperlinks between websites.

Format: <a href = "http: //" ">

Example: 4-2-31.html

<HTML>
<Head>
<Title> link to http: // </title>
</Head>
<Body>
<Center>
<H2> absolute path link </H2>
<HR>
<A href = "http://www.sina.com.cn" Title = "Open Sina Homepage"> </a> <br>
<A href = "http://www.tsinghua.edu.cn"> Tsinghua University </a> <br>
<A href = "http://www.pku.edu.cn"> Beijing University </a> <br>
<A href = "http://www.shisu.edu.cn" target = _ blank> Shanghai Foreign Language Institute </a> <br>
</Center>
</Body>
</Html>

4-2-32 send e-mail

You can create an e-mail link on the HTML page. When a visitor clicks a link, the system starts the default local email service system to send emails.

Basic Syntax: <a href = "mailto: E-Mali address: Subject = Email Subject"> description </a>

In practical applications, you can also add two other parameters "? Cc = "e-Mali address" and "& Body =? ", Which means that the email is copied to a third party and the subject content of the email.

Email Parameters

Parameter Description
Subject Email Subject
CC CC recipient
Body Subject content
BCC Send to recipient by mistake

If you want to write multiple parameters at the same time, use the "&" separator between parameters.

Example: 4-2-32.html

<HTML>
<Head>
<Title> send email </title>
</Head>
<Body>
<P>
<A href = "mailto: zhoujr3071@yahoo.com.cn? Cc = benbenmao@163.com & subject = Good morning & BCC = a@ B .c
& Body = Good morning, stupid cat wish you a Happy Morning! ">
Send an email to a friend of stupid cat (CC to stupid cat)
</A>
</P>
</Body>
</Html>

Click "send email to a friend of the stupid cat (CC to the stupid cat)" and open the system's mail service software outlook exqress to send an email.

4-2-33 link FTP

Lnternet has rich resources. By using the FTP file transfer protocol, you can obtain various free software and other files. The FTP protocol is a language that allows computers to communicate with each other, FTP enables public transmission of files and folders on lnternet. FTP can be used to access a network or server, and data can be publicly obtained through FTP without the account and Authorization password of the computer.

Syntax format:

<A href = "ftp: // FTP host address"> text link </a>

Example: 4-2-33.html

<HTML>
<Head>
<Title> link to the FTP host </title>
</Head>
<Body>
<P>
<A href = ftp://ftp.pku.edu.cn> Peking University FTP site </a>
</P>
</Body>
</Html>

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.