Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to realize hyperlink in HTML

2025-02-28 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/03 Report--

This article mainly shows you "how to achieve hyperlinks in HTML", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn "how to achieve hyperlinks in HTML" this article.

4.5.1 add links to text

The label of a hyperlink is that adding a hyperlink to text is similar to other embellishment tags. The text after adding the link has its own special style to distinguish it from other text. The default link style is blue text with underscore. The hyperlink jumps to another page, and the tag has a href attribute that specifies the address of the new page. The address specified by href generally uses a relative address.

-description: in website development, documents are more commonly used relative to addresses.

Create a web page file in the D:\ web\ directory, name it a.htm, and write the code as shown in code 4.18.

Code 4.18 setting of hyperlink: a.htm

The settings of the hyperlink go to the settings page of the list

Enter http://localhost/a.htm in the browser address bar, and the browsing effect is shown in figure 4.19.

Figure 4.19 settings for hyperlinks

The reader can see the default style of the hyperlink in figure 4.19. When you click the link on the page, the page will jump to the ul_ol.htm page in the same directory, which is the list settings page in the previous section. When you click the browser's back button to return to the a.htm page, the color of the text link changes to purple to tell the viewer that the link has been visited.

4.5.2 modify how the window of the link is opened

By default, the way a hyperlink opens a new page is to overwrite itself. Depending on the needs of the viewer, the reader can specify other ways to open a new window for the hyperlink. The hyperlink tag provides the target attribute to be set. The values are _ self (self-override, default), _ blank (create a new window to open a new page), _ top (open in the entire window of the browser, all frame structures will be ignored), and _ parent (open in the previous window).

-Note: _ top and _ parent are used for frame pages, which are explained in more detail in later chapters.

4.5.3 add prompt text to the link

In many cases, the text of the hyperlink is not enough to describe the content of the link, and the hyperlink tag provides title features that make it easy to give hints to visitors. The value of the title property is the prompt content, which appears when the viewer's cursor hovers over the hyperlink, which does not affect the neatness of the page layout. Modify the a.htm web page file and write the code as shown in Code 4.19.

Code 4.19 setting of hyperlink: a.htm

The settings of the hyperlink go to the settings page of the list

Enter http://localhost/a.htm in the browser address bar, and the browsing effect is shown in figure 4.20.

Figure 4.20 prompt text for hyperlink

4.5.4 what is an anchor (anchor)

Many web pages contain a lot of content, resulting in long pages, and visitors need to constantly drag the browser's scroll bar to find the content they need. The anchor function of the hyperlink can solve this problem. The anchor (anchor) is drawn from the anchor on the ship. After the anchor is dropped, the ship is not easy to float away and get lost. Anchors are actually used to jump to different locations within a single page, sometimes called bookmarks.

The name attribute of the hyperlink tag is used to define the name of the anchor. A page can define multiple anchors. Through the href attribute of the hyperlink, you can jump to the corresponding anchor according to the name. Create a web page file in the D:\ web\ directory, name it a_anchor.htm, and write the code as shown in code 4.20.

Code 4.20 Anchor for hyperlink: a_anchor.htm

The setting of the hyperlink here is the anchor at the top, the 1st, 2nd, 3rd, 4th, 6th President of the United States, ●, 1st (1789-1797), here is the first Anchor name: George Washington George Washington birth and death: 1732-1799 political Party:: federal ● 2nd (1797-1801) here is the second Anchor name: John Adams John Adams birth and death: 1735-1826 political Party:: federal ● Three terms (1801-1809) here is the name of the third anchor: Thomas Jefferson Thomas Jefferson birth and death: 1743-1826 political Party:: the 4th term of the Communist Party of China ● (1809-1817) here is the name of the 4th Anchor: James Madison James Madison birth and death: 1751-1836 political Party: the 5th term of the Communist Party of China ● (1817-1825) here is the name of the 5th Anchor: James Monroe James Monroe birth and death: 1758-1831 Party: Democratic Party l >

Before testing, the reader can see from Code 4.20 that the anchor is also defined with a tag, and the name of the anchor is defined by the name attribute (the name is unlimited and customizable). The link to find the anchor uses the href attribute to specify the corresponding name, preceded by a # symbol. Enter http://localhost/a_anchor.htm in the browser address bar, and the browsing effect is shown in figure 4.21.

Figure 4.21 anchors for hyperlinks

When the viewer clicks the hyperlink, the page automatically scrolls to the anchor location of the href property value name.

-Note: specific content is not necessarily required in the tag that defines the anchor, just a positioning.

4.5.5 links to email, FTP and Telnet

Hyperlinks can also further expand the functions of web pages, such as sending email, FTP and Telnet connections. To complete the above functions, you only need to modify the hrefs of the hyperlink. The format for sending e-mail is:

Send me email.

The email address must be complete, such as intel@qq.com.

As mentioned earlier, web browsing uses http protocol, while FTP server uses FTP protocol to connect. The link format is as follows:

Linked text

FTP server links differ from web page links in the protocols used. FTP requires permission to log in from the server administrator. However, some FTP servers can be accessed anonymously so that some public files can be obtained. Similarly, servers that connect to the Telnet protocol use a similar method in the following format:

Linked text

The application of telnet protocol is very few, and most of them use http protocol. Create a web page file in the D:\ web\ directory, name it mail.htm, and write the code as shown in code 4.21.

Other settings for the hyperlink in Code-4.21: mail.htm

Other settings of the hyperlink send me E-mail connection FTP server connection Telnet server s

Enter http://localhost/mail.htm in the browser address bar, and the browsing effect is shown in figure 4.22.

Figure 4.22 other settings for hyperlinks

The above is all the contents of the article "how to achieve hyperlinks in HTML". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report