SVG - 連結



<a> 元素用於建立超連結。“xlink:href”屬性用於傳遞IRI(國際化資源識別符號),它與URI(統一資源識別符號)互補。

宣告

以下是<a>元素的語法宣告。我們只顯示了主要屬性。

<a
   xlink:show = "new" | "replace"
   xlink:actuate = "onRequest"
   xlink:href = "<IRI>"
   target = "_replace" | "_self" | "_parent" | "_top" | "_blank" | "<XML-Name>" >
</a>

屬性

序號 名稱及描述
1 xlink:show − 為了XLink感知處理器的文件目的。預設值為new。
2 xlink:actuate − 為了XLink感知處理器的文件目的。
3 xlink:href − 被引用物件的地址。
4 target − 當目標資源存在多個目標時使用。

示例

testSVG.htm
<html>
   <title>SVG Linking</title>
   <body>
   
      <h1>Sample Link</h1>
      
      <svg width="800" height="800">
         <g>
            <a xlink:href="https://tutorialspoint.tw"> 
               <text x="0" y="15" fill="black" >
               Click me to load TutorialsPoint DOT COM.</text>
            </a>
         </g> 
         
         <g>
            <text x="0" y="65" fill="black" >
            Click in the rectangle to load TutorialsPoint DOT COM</text>
            
            <a xlink:href="https://tutorialspoint.tw"> 
               <rect x="100" y="80" width="300" height="100"
               style="fill:rgb(121,0,121);stroke-width:3;stroke:rgb(0,0,0)" /> 
            </a>
         </g>
      </svg>
   
   </body>
</html>

輸出

在Chrome瀏覽器中開啟textSVG.htm。您可以使用Chrome/Firefox/Opera直接檢視SVG影像,無需任何外掛。Internet Explorer 9及更高版本也支援SVG影像渲染。單擊連結和矩形以檢視結果。

列印
廣告