<a>
Baseline 广泛可用 *
<a> SVG 元素创建指向其他网页、文件、同一页面中的位置、电子邮件地址或任何其他 URL 的超链接。它与 HTML 的 <a> 元素非常相似。
SVG 的 <a> 元素是一个容器，这意味着你可以围绕文本（就像在 HTML 中一样）创建链接，也可以围绕任何形状创建链接。
使用语境
属性
download-
指示浏览器下载 URL 而不是导航到它，因此用户将被提示将其另存为本地文件。值类型：<string>；默认值：无；可动画：否
hrefhreflang-
超链接指向的 URL 或 URL 片段的人类可读语言。值类型：<string>；默认值：无；可动画：否
ping实验性-
一个空格分隔的 URL 列表，当跟随超链接时，浏览器会在后台向这些 URL 发送带有
PING主体的POST请求。通常用于跟踪。对于解决相同用例且支持更广泛的功能，请参阅Navigator.sendBeacon()。值类型：<list-of-URLs>；默认值：无；可动画：否 referrerpolicy-
在获取 URL 时要发送的 Referer。值类型：
no-referrer|no-referrer-when-downgrade|same-origin|origin|strict-origin|origin-when-cross-origin|strict-origin-when-cross-origin|unsafe-url；默认值：无；可动画：否 rel-
目标对象与链接对象的关系。值类型：<list-of-Link-Types>；默认值：无；可动画：否
目标-
链接的 URL 的显示位置。值类型：
_self|_parent|_top|_blank| <XML-Name>；默认值：_self；可动画：是 type-
链接 URL 的 MIME 类型。值类型：<string>；默认值：无；可动画：否
xlink:href已弃用-
超链接指向的 URL 或 URL 片段。为兼容旧浏览器可能需要。值类型：<URL>；默认值：无；可动画：是
DOM 接口
此元素实现了 SVGAElement 接口。
示例
<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"><circle></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;
}
警告： 由于此元素与 HTML 的 <a> 元素共享其标签名，因此使用 CSS 或 querySelector 选择 a 可能会应用于错误的元素类型。尝试使用 @namespace 规则来区分两者。
规范
| 规范 |
|---|
| Scalable Vector Graphics (SVG) 2 # AElement |
浏览器兼容性
加载中…
另见
xlink:title属性- HTML
<a>元素