Home  >  Article  >  Web Front-end  >  Example tutorial on HTML links

Example tutorial on HTML links

零下一度
零下一度Original
2017-06-24 13:50:481218browse

HTML uses a hyperlink to connect to another document on the web. Links can be found on almost every web page. Click a link to jump from one page to another.



Try it - Example

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

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


HTML Hyperlink (Link)

HTML uses the tag to set up hypertext Link.

A hyperlink can be a word, a word, a group of words, or an image. You can click on these contents to jump to a new document or a certain part of the current document.

When you move the mouse pointer over a link on the web page, the arrow will change into a small hand.

The href attribute is used in the tag to describe the link address.

By default, links will appear in the browser as follows:

  • An unvisited link appears in blue font and underlined.

  • Visited links appear purple and underlined.

  • When a link is clicked, it appears red and underlined.

Note: If CSS styles are set for these hyperlinks, the display style will be displayed according to the CSS settings.


HTML link syntax

The HTML code for the link is very simple. It looks like this: :

# The ##href attribute describes the target of the link. .

Example

The above line of code displays as:: Visit the Rookie Tutorial

Clicking this hyperlink will take the user to the home page of the Rookie Tutorial.

Tips: "Link text" It doesn’t have to be text. Images or other HTML elements can become links.


HTML Link - target attribute

Using the target attribute, you can define where the linked document is displayed.

The following line will open the document in a new window:

Example

##<
a href="" target="_blank">Visit the novice tutorial !a> Try it»

HTML Link - id attribute


The id attribute can be used to create bookmark tags in an HTML document.

Tips:

Bookmarks are not displayed in any special way and are not displayed in HTML documents, so they are hidden from readers.

Example

Insert ID in HTML document:

Useful tips section

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

Visit Helpful Tips Section

Alternatively, create a link to the "Helpful Tips Section (id="tips")" from another page:

Visit the helpful tips section

Basic Notes - Helpful Tips


Notes:

Always add forward slashes to subfolders. If you write the link like this: href="http://www.runoob.com/html", two HTTP requests will be generated to the server. This is because the server will add a forward slash to the address and then create a new request, like this: href="http://www.runoob.com/html/".


More examples

Image link
How to use image link.

Link to the specified location on the current page
How to use bookmarks

Step out of the frame
This example demonstrates how to jump out of the frame, if your page is fixed within the frame.

Create Email Link
This example demonstrates how to link to an email. (This example can only work after installing the mail client program.)

Create an email link 2
This example demonstrates a more complex email link.


HTML link tag


## TagDescription Define a hyperlink

The above is the detailed content of Example tutorial on HTML links. For more information, please follow other related articles on the PHP Chinese website!