HTML Link Code
This page contains examples of html link code. You can copy and paste this code into your own HTML documents - just change the values of the attributes as required.
HTML Link: Same Window
HTML Link: New Window
HTML Link: Email Link
HTML Link: Named Anchors
Named anchors allow you to "jump" to a given point on a page. This requires two pieces of code: one to create the named anchor, and one to link to the named anchor.
To create a named anchor:
<h2>Link Targets<a id="link_targets"></a></h2>To link to a named anchor:
<a class="/html/tutorial/html_links.cfm#link_targets">Link Targets</a>This code results in:
Note that I have previously created the named anchor on the destination page. The link can only work properly if the named anchor has been created on the destination page.
Prior to HTML5, named anchors used the name attribute. However this attribute is obsolete in HTML5 and you should use the id attribute instead (as outlined above).
Read more about creating named anchors on the HTML links lesson of the HTML tutorial.
Linked Images
You can also link images. That way, when the user clicks on the image, a new page is displayed (or a larger version of the image). Like this:
Link Code Template
You can use the following template as a basis for your HTML link codes. Simply fill in the blanks or remove uneeded attributes.
For an explanation of all the attributes, see the anchor tag.
<a class=""
name=""
hreflang=""
type=""
rel=""
rev=""
charset=""
shape=""
coords=""
target=""
accesskey=""
dir=""
class=""
id=""
lang=""
tabindex=""
title=""
style=""
onfocus=""
onblur=""
onclick=""
ondbclick=""
onmousedown=""
onmouseup=""
onmouseover=""
onmousemove=""
onmouseout=""
onkeypress=""
onkeydown=""
onkeyup="">Link Text goes here</a>For various HTML link code usage, check out the HTML links page of the HTML tutorial.