Jak korzystać z zewnętrznego SVG w HTML?

Question

Staram się HTML, że odniesienia do pliku SVG, że plik SVG interractive (CSS najechania kursorem):

1. Jeśli używam <img src="algerie.svg"> stracę interaktywność.

   

2. Jeśli otworzyć obrazek w nowej karcie przy użyciu narzędzia dev, staje się interaktywny.

   

3. Jeśli używam:

   <svg viewBox="0 0 512 512"> 
       <use xlink:href="algerie.svg"></use> 
   </svg> 
   

   Wtedy nic nie jest pokazane, a co gorsza, Chrome lub Firefox nie wykryje plik w narzędziu dev sieć.

Answer 1

Należy umieścić obraz za pomocą <object> tag:

<object data="algerie.svg" type="image/svg+xml"></object> 

sprawdź na to pytanie o szczegóły: Do I use <img>, <object>, or <embed> for SVG files?