Webpage Workshop: Home » HTML language reference » Anchor

Anchor

The anchor element is used to indicate that a section of the document is a hyperlink or the target for a hyperlink. An anchor element can contain text or an image. In the case of text, this is normally rendered as an underlined, colored section within the text; whereas with an image, this is often shown as an image with a colored border around it.

<a
    accesskey="key"
    charset="charset code"
    class="class name(s)"
    coords="comma separated numbers"
    dir="ltr | rtl"
    href="url"
    hreflang="language code"
    id="unique identifier"
    lang="language code"
    name="name of target"
    rel="comma separated relationship values"
    rev="comma separated relationship values"
    shape="default | circle | poly | rect"
    style="style information"
    tabindex="number"
    target="_blank | frame-name | _parent | _self | _top"**
    title="text"
    type="content type of linked data"
>
</a>

Key:
‡ = Required attribute
** = Transitional only

Explanation of attributes

accesskey: used to define a key on the keyboard that can be used to select this element. This generally depends on the browser and operating system being used.

charset: used to define the character encoding of the target resource. The value of this attribute is a code specified in RFC 2045, for example UTF-8 or ISO-8859-1. The default value of this attribute is ISO-8859-1.

class: used to state which class(es) the element belongs to. It is possible to indicate more than one class for an element by separating each class name with a space character. This attribute is normally used in combination with a stylesheet in order to associate the elements with particular styles defined within the stylesheet.

coords: used to define the coordinates of a object on the page. This takes the form of a comma separated list of numbers.

dir: used to set the direction of the text in combination with the language set in the lang attribute. The available values are "ltr" (left to right) and "rtl" (right to left), with the default value being "ltr".

href‡: used to define the URL that a hyperlink points to. This is the only required attribute of the anchor element when used as a hyperlink. It can refer to either a URL or a URL fragment; a name preceeded by the hash symbol (#).

hreflang: this attribute is used to specify the language in which the linked resource is written. This is specified using a language code.

id: used to specify a unique alphanumeric identifier to the element. This is usually used in combination with stylesheets in order to apply a style to one particular instance of an element. Only one element, regardless of type, can be given a particular id.

lang: used to indicate the language being used in the text contained within the element. The value of this attribute takes on the form of the ISO standard lanuage abbreviations found in RFC 3066. A list of these codes can be found on the ISO language codes page.

name: used to define a location within a document that a hyperlink can point to. This is an alphanumerical identifier similar to the one used by the id attribute. You can only use both the name and id attributes together if they both contain the same value.

rel: used to specify the relationship between the link object and the target resource. This attribute should only be used in combination with the href attribute.

rev: this is the inverse relationship of the rel attribute. It can be used, for example, to indicate where the linked resource originated by giving the name of the author or similar.

shape: used to define the selectable region of the hyperlink in order to create an image map. This attribute is used in combination with the coords attribute. The exact format of the coords values depends on the value of this attrbute. For "rect" the values are x,y,w,h where x and y are the coordinates of the top-left corner, whereas w and h are used for the width and the height in pixels. For circle, the values take on the form x,y,r where x and y are the coordinates of the center of the circle, and the r value is the radius in pixels. For "poly" the values are x1,y1,x2,y2,... where each pair of x and y values represent one coordinate in the polygon. Each coordinate is joined to the next by a straight line, with the final being joined to the first.

style: used to specify an inline style to apply to the element. The styles defined here override the styles declared in the header section.

tabindex: used to define the elements position in the tabbing order of the document. This attribute contains a number, which a traversed in order by using the TAB key.

target**: used to specify the target window for the linked resource. Some of the values for this attribute are special in that they refer to specific frames, such as _blank (a new window), _parent (the parent frame), _self (the frame containing the link), and _top (the full browser window). Other values are used to target frames by the name defined in the frame element.

title: used to define an advisory text that may be displayed as a tooltip when a mouse is used to hover over the element.

type: used to define what MIME type the linked resource is, ie. what type of file it is. This is provided as advisory information as no browser currently does anything with this attribute.

Event handlers

The following event handlers are defined for this element:

Basic example

<a href="http://www.webpageworkshop.co.uk">Webpage Workshop</a>

The above code will display something like: Webpage Workshop

Compatibility

Description: Support of anchor and attributes in various browsers
Test Internet Explorer 6+ Netscape 4 Mozilla and Netscape 6+ Opera 6+ MSN TV (WebTV) Konqeuror 3.0+
Basic element support  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: accesskey  Yes  No  Yes  Yes  No 
Attribute: charset  No  No  No  No  No  No 
Attribute: class  Yes  Yes  Yes  Yes  No  Yes 
Attribute: coords  No  No  Yes  Yes  No 
Attribute: dir  Yes  No  Yes  Yes  No  No 
Attribute: href  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: hreflang  No  No  No  No  No  No 
Attribute: id  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: lang  Yes  Yes  Yes  Yes  No  Yes 
Attribute: name  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: rel  Yes  No  Yes  Yes  No  No 
Attribute: rev  Yes  No  Yes  Yes  No  No 
Attribute: shape  No  No  Yes  Yes  No 
Attribute: style  Yes  Yes  Yes  Yes  No  Yes 
Attribute: tabindex  Yes  No  Yes  Yes  No 
Attribute: target  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: title  Yes  No  Yes  Yes  No  Yes 
Attribute: type  No  No  No  No  No  No 

Key:
The browser icons are explained in the below list:
Internet Explorer 6+ = Microsoft Internet Explorer 6+
Netscape 4 = Netscape Communicator 4
Mozilla and Netscape 6+ = Mozilla and Netscape Navigator 6+
Opera 7+ = Opera 7+
MSN TV (WebTV) = MSN TV (aka. WebTV)
Konqeuror 3.0+ = Konqueror 3.0+