Link (link) in HTML

Link (link) in HTML


In the previous article, readers read Taimienphi.vn to learn about the color attribute in HTML. The next article below Taimienphi.vn will introduce you more about the link (link) in HTML.


We can learn HTML and find links (links) on almost all websites. By clicking on the link to redirect to another site. Refer to the following article of Taimienphi.vn to find out details link (link) in HTML.

Link (link) in HTML

Table of Contents:
1. Link (link) in HTML
1.1. Syntax for links in HTML

1.2. Local Link in HTML
1.3. Set color for links in HTML
1.4. The target attribute in HTML
1.5. Image Link in HTML
1.6. Link Title in HTML
1.7. Create Bookmark in HTML
1.8. External path in HTML
2. Summary

1. Link (link) in HTML

Links (links) in HTML are hyperlinks.

By clicking on the link to redirect to another website or document. When we hover over a link, the mouse arrow turns into another icon.

Note: The link is not text, it could be an image or any HTML element.

1.1 Syntax of links in HTML

Hyperlinks are identified by tags a in HTML:

Link to link in html

Inside:
– Properties href Specify the destination address of the link (such as Taimienphi.vn).
Link text is the display. Click on the link text to redirect to the specified address.

Note: There is no slash at the end of the subdirectory address, and you can make 2 requests to the server. Many servers will automatically add a trailing slash at the end of the address and then create a new request.

For example: The following is an example illustrating how to use link syntax in HTML:

Link in html 2

The result will look like this:

Link in html 3

1.2 Local Link in HTML

In the example above we use absolute URLs (full website addresses).

Local Link (link to same website) is indicated by relative URL (no https: // www …).

For example: Below is an example of a local link in HTML.

Link in html 4

The results returned when applying the local link look like this:

Link in html 5

1.3 Set color for links in HTML

The default link (link) will display in all browsers as below:
– The link is not accessible underlined and green.
– Access link is underlined and purple.
– Link activities are underlined and red.

However, if you wish you can change the default color for links in HTML using CSS:
For example: The following example illustrates the color settings for links in HTML:

Link in html 6

The result returned when changing color for the link looks like the following:

Link in html 7

1.4 The target attribute in HTML

Properties target Used to specify where to open the linked document.

Properties target may include one of the following:
_blank: Open the linked document in a new window or tab.
_self: Open the linked document in the same window / tab when the user clicks the link (default).
_parent: Open the linked document in the main window.
_top: Open the linked document in the entire window.
framename: Open the document linked in the frame tab.

Example 1: In the example below, open the linked document in a new window / tab:

Link in html 8

The result will look like this:

Link in html 9

Tips: If the site is locked in a frame, you can use it target = “_ top” to open that frame.

Example 2: The following example illustrates the usage target = “_ top”:

Link in html 10

The result will look like this:

Link in html 11

1.5 Image Link in HTML

We can use images as links in HTML.

For example: Here is an example of image link in HTML:

Link in html 12

The result will look like this:

Link in html 13

Note: In the example above we added border: 0 to prevent IE9 and earlier browser versions from displaying borders around images in case the image is a link.

1.6 Link Title in HTML

Properties title Specify more information about the element. Information is usually displayed as text in the tooltip when the user hovers over the element.

For example: The following is an example illustrating how to use the title attribute to specify additional information about an element in HTML:

Link in html 14

The result will look like this:

Link in html 15

1.7 Create Bookmark in HTML

Bookmarks in HTML are used to allow users to navigate to specific parts of the site.

To create bookmarks in HTML, we must first create a bookmark and then add a link to that bookmark.

When the user clicks on the link, the page will scroll to the bookmarked location.

For example: Here’s an example of creating a bookmark in HTML:

First we use the id attribute to create bookmarks:

Link in html 16

The next step is to add the link to the bookmark (in this example, “Jump to Chapter 4”) on the same page:

Link in html 17

Or add a link to your bookmark (“Jump to Chapter 4”) from another page:

Link in html 18

The result will look like this:

Link in html 19

1.8 External links in HTML

External pages may be referenced by the full URL or the link associated with the current site.

Example 1: The example below uses the full URL to link to the site:

The link is linked in html 20

The result will look like this:

Link in html 21

Example 2: The following example links a page in the html directory on the current web page:

Link in html 22

The result will look like this:

Link in html 23

Example 3: The following example links a page located in the same directory as the current page:

Link in html 24

The result will look like this:

Link in html 25

2. Summary

Link in html 26

https://thuthuat.taimienphi.vn/link-lien-ket-rong-html-50616n.aspx
The article above Taimienphi.vn has just introduced you to the link (link) in HTML. In the next article, Taimienphi.vn will introduce you further img tag in HTML. In addition, if you have any questions or questions, you can leave your comments in the comment section below the article.

.

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *