2014年6月30日 SVG 以前書いた「アイコンフォントからSVGへ!より手軽にベクター画像を表示しよう」という記事でSVGの基本や効率よく使用する方法を紹介しましたが、実際にWebサイト内で使うにはもう少し具体例が必要だなーと思ったのでリンク関連を中心に補足します。基本的な記述方法を覚えて実用化していきましょう! ↑私が10年以上利用している会計ソフト! SVGにリンクを貼る SVGにリンクを貼りたい場合、単純に a タグで svg を囲んでもうまくリンクを貼ることはできません。svg タグの中のオブジェクトを a タグで囲み、xlink:href 属性でURLを指定する必要があります。 <svg ... > <a xlink:href="http://google.com"> <path fill="#1E899D" ... > </a> </svg> See the Pen SVG
![SVGアイコンを実用するために知っておきたい、リンク周りの記述方法](https://cdn-ak-scissors.b.st-hatena.com/image/square/a2c7ebb8a3172c130648aab22b4ecfeec7607e03/height=288;version=1;width=512/https%3A%2F%2Fwww.webcreatorbox.com%2Fwp-content%2Fthemes%2Fwcb3%2Fimages%2Flogo.jpg)