HTML links


May 02, 2021 11:07 HTML


Table of contents


HTML link


HTML uses hyperlinks to connect to another document on the network. L inks can be found on almost all web pages. Clicking on a link can jump from one page to another.


HTML links

Try it - instance

HTML links
How to create a link in an HTML document.

(More examples can be found at the bottom of this page)


HTML hyperlinks (links)

HTML uses tags to set up hyper-text links, which can be linked from one page to another.

Hyperlinks can be a word, a word, or a set of words, or an image that you can click to jump to a new document or a section of the current document.

When you move the mouse pointer over a link in a Web page, the arrow becomes a small hand.

The href property is used to describe the address of the link in the label slt;a.gt;

By default, links appear in the browser as follows:

  • An unresoled link appears in blue font with an underlined line
  • The visited links appear purple and are underlined
  • When you click a link, it appears red and underlined
Note: If CSS styles are set for these hyperlinks, the presentation styles are displayed based on the settings of the CSS

HTML empty link

HTML empty link: After pointing to a link, the mouse becomes hand-shaped, but remains on the current page after clicking.

Temporary addition of empty links, mainly in order to better see the final effect.

Basic syntax:

<a href="#">链接文字</a>

Where the " indicates an empty link.

<a href="#">W3CSchool</a>


HTML link syntax

The linked HTML code is simple. It's like this:

<a href="url">Link text</a>

The href property describes the target of the link.

<a href="//www.w3cschool.cn/">Visit W3Cschool</a>

The above line of code appears as: Visit W3Cschool

Clicking on this hyperlink will take the user to the home page of W3Cschool.

Tip: L ink Text doesn't have to be text. Pictures or other HTML elements can be links.


HTML link - target property

Using the Target property, you can define where the linked document appears (in a new window or in an original window).

The following line opens the document in a new window:

<a href="https://www.w3cschool.cn/" target="">访问W3Cschool教程!</a>

<p>如果你将 target 属性设置为 "_blank", 链接将在新窗口打开。</p>


Try it out . . .

Tip: The default linked document opens in the original window. If you set the target property to _blank, the document opens in a new window.



HTML link - id property

The id property can be used to create bookmark marks in an HTML document.

Tip: Bookmarks don't appear in any particular way, they don't appear in HTML documents, so they're hidden for readers.

Insert an ID in an HTML document:

<a id="tips">Useful Tips Section</a>

Create a link in the HTML document to the Useful Tips section (id="tips"):

<a href="#tips">Visit the Useful Tips Section</a>

Alternatively, create a link from another page to the "Useful Tips" section:

<a href="//www.w3cschool.cn/html_links.html#tips"> Visit the Useful Tips Section</a>



Basic considerations - useful tips

Note: Always add the forward slash to the sub-folder. I f you write a link like this: "//www.w3cschool.cn/html", two HTTP requests are made to the server. This is because the server adds a forward slash to this address and then creates a new request, like this: href "//www.w3cschool.cn/html/".


HTML links

More instances

Photo link
How to use the picture link.

How to use bookmarks when linking to a specified location on the current page

Jump out of the frame
This example shows how to jump out of a frame if your page is pinned to the frame.

Create an e-mail link
This example shows how to link to a message. ( This example does not work until the mail client program is installed.)

Create an e-mail link 2
This example demonstrates more complex mail links.


HTML link tag

标签 描述
<a> 定义一个超级链接