HTML Links
A link is the "address" to a document (or a resource) on the web.
Examples
HTML links
This example demonstrates how to create links in an HTML document.
Open a link in a new browser
window
This example demonstrates how to link to another page by opening a new
window, so that the visitor does not have to leave your Web site.
(You can find more examples at the bottom of this page)
Hyperlinks, Anchors, and Links
In web terms, a hyperlink is a reference (an address) to a
resource on the web.
Hyperlinks can point to any resource on the web: an HTML page, an image, a sound file, a movie,
etc.
An anchor is a term used to define a hyperlink destination inside a document.
The HTML anchor element <a>, is used to define both hyperlinks and anchors.
We will use the term HTML link when the <a> element points to a resource, and
the term HTML anchor when the <a> elements defines an address inside a document..
An HTML Link
Link syntax:
<a href="url">Link text</a>
|
The start tag contains attributes about the link.
The element content (Link text) defines the part
to be displayed.
Note: The element content don't have to be a text. You can link from
an image or any other HTML element.
The href Attribute
The href attribute defines the link "address".
This <a> element defines a link to W3Schools:
<a href="http://www.w3schools.com/">Visit W3Schools!</a>
|
The code above will display like this in a browser:
Visit W3Schools!
The target Attribute
The target attribute defines where the linked document will be
opened.
The code below will open the document in a new browser window:
<a href="http://www.w3schools.com/"
target="_blank">Visit W3Schools!</a>
|
Try it yourself
The name Attribute
When the name attribute is used, the <a> element defines a named anchor
inside a HTML document.
Named anchor are not displayed in any special way. They are invisible to the
reader.
Named anchor syntax:
<a name="label">Any content</a>
|
The link syntax to a named anchor:
<a href="#label">Any content</a>
|
The # in the href attribute defines a link to a named anchor.
Example:
A named anchor inside an HTML document:
<a name="tips">Useful Tips Section</a>
|
A link to the Useful Tips Section from the same document:
<a href="#tips">
Jump to the Useful Tips Section</a>
|
A link to the Useful Tips Section from another document:
<a href="http://www.w3schools.com/html_tutorial.htm#tips">
Jump to the Useful Tips Section</a>
|
Basic Notes - Useful Tips
Always add a trailing slash to subfolder references. If you link like this: href="http://www.w3schools.com/html",
you will generate two HTTP requests to the server, because the server will add a slash
to the address and create a new request like this: href="http://www.w3schools.com/html/"
Named anchors are often used to create "table of contents" at the beginning
of a large document.
Each chapter within the document is given a named anchor, and links to each of these anchors are put at the top of the
document.
If a browser cannot find a named anchor that has been specified, it goes to the top of the
document. No error occurs.
More Examples
An image as a link
This example demonstrates how to use an image as a link.
Link to a location on the
same page
This example demonstrates how to use a link to jump to another part of a document.
Break out of a frame
This example demonstrates how to break out of a frame, if your site is locked in a frame.
Create a mailto link
This example demonstrates how to link to a mail message (will only work if
you have mail installed).
Create a mailto link 2
This example demonstrates a more complicated mailto link.
Link Tags
Tag |
Description |
<a> |
Defines an anchor |
Reliable, affordable, feature-rich web hosting!
Take the uncertainty out of Web hosting and let
GoDaddy.com
put service, performance and value back in. No matter which
hosting type or plan you choose, your site receives 24/7
maintenance and protection in our world-class data center. Plus,
you get the expert, friendly service you deserve, from the
world's largest hostname provider.
With three plans to choose from and
prices starting at just $4.99 per month, GoDaddy.com is sure to have a plan that's
right-sized and right-priced just for you!
All plans feature FREE 24x7 setup, FREE 24x7 monitoring, best-
of-breed routers, firewalls and servers, 24x7 onsite physical security
and access to our exclusive Go Daddy Hosting Connection, THE place
to install over 30 FREE applications. Virtual Dedicated and Dedicated
Server plans also available.
Visit GoDaddy.com today.
Virtual Dedicated, Dedicated Server and unlimited plans also available.
Save 10% on web hosting - Enter code w3tenoff at checkout
|
|
Get Your Diploma!
W3Schools' Online Certification Program is the perfect solution for busy
professionals who need to balance work, family, and career building.
The HTML Certificate is for developers who want to document their knowledge of HTML, XHTML, and CSS.
The JavaScript Certificate is for developers who want to document their knowledge of JavaScript and the HTML DOM.
The XML Certificate is for developers who want to document their knowledge of XML, XML DOM and XSLT.
The ASP Certificate is for developers who want to document their knowledge of ASP, SQL, and ADO.
The PHP Certificate is for developers who want to document their knowledge of PHP and SQL (MySQL).
|
|