なぜやるか cssスプライトと違って、 スタイルの変更がcssでできる ベクター画像なのでサイズ変更可能 retina対応のための画像を作ることが不要 色変更のために作り直すことが不要 svgブラウザ対応状況 svg - Can I use... Support tables for HTML5, CSS3, etc IE9-Edge12、Safari 5.1-6にはによる外部ファイルの参照をサポートしていません。 IEで読み込むためには、polyfillが必要です。詳細はIEに対応するで説明します。 polyfills(ポリフィル)というのは、数年前から言われている概念なので、 知っている人もいくらかいるのではないかと思いますが、 モダンブラウザで普通に出来て、レガシーブラウザで出来ない機能を、既存の技術で(あるいはそれらの組み合わせで)同等のものを提供する、という手法です。 (引用元:
![svgスプライトの作り方から使い方まで - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/8719e5b2dfa328117a8bb3c315cf4b9a5878c418/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9c3ZnJUUzJTgyJUI5JUUzJTgzJTk3JUUzJTgzJUE5JUUzJTgyJUE0JUUzJTgzJTg4JUUzJTgxJUFFJUU0JUJEJTlDJUUzJTgyJThBJUU2JTk2JUI5JUUzJTgxJThCJUUzJTgyJTg5JUU0JUJEJUJGJUUzJTgxJTg0JUU2JTk2JUI5JUUzJTgxJUJFJUUzJTgxJUE3JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWNsaXA9ZWxsaXBzaXMmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1hZDMyZmVjMTc3ZjdhYTJlZjJlYTJhZGRmZDljYzM4MQ%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwZ2FybzEyMjEmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTcwMmMwYmI4MDNkZjc0NDVkOTVlZjlmN2UwYTdhMzU3%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D233027bada6489579381429448771720)