Links are found in nearly all web pages. Links allow users to click their way from page to page.
HTML links are hyperlinks.
A hyperlink is a text or an image you can click on, and jump to another document.
In HTML, links are defined with the <a> tag:
The href attribute specifies the destination address (http://www.w3schools.com/html/)
The link text is the visible part (Visit our HTML tutorial).
Clicking on the link text, will send you to the specified address.
|The link text does not have to be text. It can be an HTML image or any other HTML element.|
|Without a trailing slash on subfolder addresses, you might generate two requests to the server. Many servers will automatically add a trailing slash to the address, and then create a new request.|
The example above used an absolute URL (A full web address).
A local link (link to the same web site) is specified with a relative URL (without http://www....).
When you move the mouse over a link, two things will normally happen:
By default, a link will appear like this (in all browsers):
You can change the default colors, by using styles:
The target attribute specifies where to open the linked document.
This example will open the linked document in a new browser window or in a new tab:
|_blank||Opens the linked document in a new window or tab|
|_self||Opens the linked document in the same frame as it was clicked (this is default)|
|_parent||Opens the linked document in the parent frame|
|_top||Opens the linked document in the full body of the window|
|framename||Opens the linked document in a named frame|
If your webpage is locked in a frame, you can use target="_top" to break out of the frame:
It is common to use images as links:
|border:0 is added to prevent IE9 (and earlier) from displaying a border around the image.|
HTML bookmarks are used to allow readers to jump to specific parts of a Web page.
Bookmarks are practical if your website has long pages.
To make a bookmark, you must first create the bookmark, and then add a link to it.
When the link is clicked, the page will scroll to the location with the bookmark.
First, create a bookmark with the id attribute:
Then, add a link to the bookmark ("Useful Tips Section"), from within the same page:
Or, add a link to the bookmark ("Useful Tips Section"), from another page:
|<a>||Defines a hyperlink|