The "href" attribute names the connection to another web page. Actually is the place where it will be sent, the user that clicks on the link.
Links can be:
htmlInternal - href="#anchorname"
Local - href="../img/foto.jpg"
Global - href="http://www.tutorialehtml.com/"
To set the beginning and the end of a anchor it can be used <a></a>. Choose the type of the attribute that you need then put it inside the tag.
Example:
html<a href="http://www.tutorialehtml.com" target="_blank" title="HTML Tutorials">HTML Tutorials</a>
The "target" attribute tells the browser if it needs to open a new page in a new window or in the same window.
target=" | _blank" | Opens a new window |
_self" | Opens a page in the same window | |
_parent" | Opens a new page in a superior frame of the link | |
_top" | Opens a new page in the same browser canceling all the frames |
The next example shows how a new page can be opened in a window of the browser. In this way, we can remain on the tutorial's page and open a new navigation page.
html<a href="http://www.google.com/" target="_blank" >Google </a>
Is used to link two sections of the same page. In this way, we need to give a name to those sections, but for this is indicated to take a look at the next example.
html<h1>HTML - Hypertext Reference / href<a name="top"></a></h1>
<h2>HTML - Text links<a name="text"></a></h2>
<h2>HTML - E-mail text<a name="email"></a> </h2>
Next, we need to make a code to the link by putting it before the anchor's name
html<a href="#top">Go to top </a>
<a href="#text">Learn about text links </a>
<a href="#email">Learn about e-mail addresses </a>
To make an e-mail link is very simple. If you want someone to write you an email the best thing to do would be to put at its disposition a link with your email and a pre-established subject.
html<a href="mailto:someone@example.com?subject=Questions " >Questions here</a>
In case the subject is not enough and you want to add something else to the email's content, you can do it with the help of the next code:
html<a href="mailto:someone@example.com?subject=Questions&body=Write here if you have questions " >Questions here </a>
A download link looks like a normal link text. The problem kicks in when we want to add a photograph. The best solution is to use a thumbnail with a link, but we will talk more about this problem in the next lesson.
html<a href="http://www.tutorialehtml.com/htmlT/text.zip">Text Document</a>
When we see a video on a YouTube page, we usually have the button to subscribe right next to it. But what happens when the video is inserted on our own website. Here is how we can simulate a similar link in the same way. Feel free to click to see how it works.
html<a href="https://www.youtube.com/channel/UCpGSnR65YSFi9mdNPCQSJyA?sub_confirmation=0">Subscribe to the channel</a>
use the <base> tag in the interior of the <head> element to set a base link. This is necessary in case you have somewhere a link that doesn't work or in case the destination doesn't exist anymore. The base link sends the user to the specified address. Usually, it sends the user to the upper part of the page but is as well accepted on any other page, eventually, a special page is made for this purpose.
html<head>
<base href="http://www.tutorialehtml.com/">
</head>