<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>元素