HTML links

      No Comments on HTML links

HTML links are hyperlinks.A document contains various links that take you directly to other pages or to specific parts of a document. These links are called hyperlinks.

HTML links -Syntax

Links are specified in the <a> anchor tag. The part between the opening tag &ly;a> and the closing tag </a> is clickable. One can click on this part to link to other documents or pages.

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

Example:

  • href attribute provide the linklocation
  • link text is the visible and clickable part in the anchor tag.

Local links

The above example used an absolute URL that is a full web address.Local links are links to the same website, they are specified using a relative URL. For example:

<a href='html-computer-code-elements.html'>link</a>

link

HTML link colors

By default the HTML links have following colors

  • An unvisited link is blue and underlined
  • A visited link is purple and underlined
  • An active link is red and underlined

Link color can be changed using

<style>
.demo_link a:link
{ 
   color:green;
   text-decoration:none;
}
.demo_link a:visited
{ 
   color:red;
   text-decoration:none;
}
.demo_link a:hover
{ 
   color:brown;
   text-decoration:none;
}
.demo_link a:active
{ 
   color:orange;
   text-decoration:none;
}
</style>

Target attribute

The target attribute specifies where to open the linked document. target attribute can have one of the following values:

  • _blank: opne s the linked document in a new window.
  • _self: opens the linked document in the same tab/window (default).
  • _parent: opens the linked document in parent frame.
  • _top: opens the linked document in full body window
  • framename: opens the linked document in the named frame.
<a href="http://scanfcode.com" target="_blank">link open in new window</a>

HTML images as links

We can also use images as links

<a href="http://scanfcode.com"><img src="http://scanfcode.com/scanfcode1.png" alt="HTML links"/></a>

HTML links

HTML links-Create a bookmark

HTML bookmarks allow you to move to a specific part in a web page. Bookmarks are usefull in very long web pages.
To make a bookmark, you first create a bookmark and then add a link to it.When the link is clicked the page will scroll to that point.

Create a bookmark

<h2 id="tip">HTML links -Syntax</h2>

Adding a link to bookmark

<a href="#tip">HTML links syntax</a>

Leave a Reply

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