<a>

Usage context

Attributes

download

Instructs browsers to download a URL instead of navigating to it, so the user will be prompted to save it as a local file. Value type: <string>; Default value: none; Animatable: no

href

The URL or URL fragment the hyperlink points to. Value type: <URL>; Default value: none; Animatable: yes

hreflang

The human language of the URL or URL fragment that the hyperlink points to. Value type: <string>; Default value: none; Animatable: no

interestfor

Defines the <a> element as an interest invoker. Its value is the id of a target element that will be affected in some way (normally shown or hidden) when interest is shown or lost on the invoker element (for example, by hovering/unhovering or focusing/blurring it). See Using interest invokers for more details and examples. Value type: <string>; Default value: none; Animatable: no

ping

A space-separated list of URLs to which, when the hyperlink is followed, POST requests with the body PING will be sent by the browser (in the background). Typically used for tracking. For a more widely-supported feature addressing the same use cases, see Navigator.sendBeacon(). Value type: <list-of-URLs>; Default value: none; Animatable: no

referrerpolicy

Which referrer to send when fetching the URL. Value type: no-referrer | no-referrer-when-downgrade | same-origin | origin | strict-origin | origin-when-cross-origin | strict-origin-when-cross-origin | unsafe-url; Default value: none; Animatable: no

rel

The relationship of the target object to the link object. Value type: <list-of-Link-Types>; Default value: none; Animatable: no

target

Where to display the linked URL. Value type: _self | _parent | _top | _blank | <XML-Name>; Default value: _self; Animatable: yes

type

A MIME type for the linked URL. Value type: <string>; Default value: none; Animatable: no

xlink:href

The URL or URL fragment that the hyperlink points to. May be required for backwards compatibility for older browsers. Value type: <URL>; Default value: none; Animatable: yes

DOM Interface

This element implements the SVGAElement interface.

Example

@namespace svg url("http://www.w3.org/2000/svg");
html,
body,
svg {
  height: 100%;
}

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <!-- A link around a shape -->
  <a href="/docs/Web/SVG/Reference/Element/circle">
    <circle cx="50" cy="40" r="35" />
  </a>

  <!-- A link around a text -->
  <a href="/docs/Web/SVG/Reference/Element/text">
    <text x="50" y="90" text-anchor="middle">&lt;circle&gt;</text>
  </a>
</svg>

/* As SVG does not provide a default visual style for links,
   it's considered best practice to add some */

@namespace svg url("http://www.w3.org/2000/svg");
/* Necessary to select only SVG <a> elements, and not also HTML's.
   See warning below */

svg|a:link,
svg|a:visited {
  cursor: pointer;
}

svg|a text,
text svg|a {
  fill: blue; /* Even for text, SVG uses fill over color */
  text-decoration: underline;
}

svg|a:hover,
svg|a:active {
  outline: dotted 1px blue;
}

Specifications

Browser compatibility

See also

• xlink:title attribute
• HTML <a> element