Внешние значки SVG не отображаются в Firefox

Я хочу использовать значки SVG на своей веб-странице. Поэтому я создал SVG-файл (defs.svg), содержащий все определения иконок:Внешние значки SVG не отображаются в Firefox

<svg style="position:absolute;width:0;height: 0;" width="0" height="0" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
 
<defs> 
 
<symbol id="img_test" viewBox="0 0 1024 1024"> 
 
\t <path class="path1" d="M860.184 52.761c93.399 0 163.812 67.858 163.812 163.782v364.038c0 83.333-65.224 163.97-163.812 163.97h-277.814c-25.609 0-61.008 14.799-79.019 33.044l-180.619 182.944c-18.018 18.222-36.535 12.602-41.359-12.553l-30.289-157.833c-4.827-25.156-26.314-45.597-48.017-45.597h-39.264c-100.936 0-163.804-73.116-163.804-163.97v-364.042c0-98.634 67.858-163.782 163.804-163.782h696.38z"></path> 
 
</symbol> 
 
... 
 
</defs> 
 
</svg>

Однако, когда я использую следующий код для визуализации на значке

<svg style="display:inline-block;width:48px;height:48px;fill:#000;"> 
 
    <use xlink:href="http://www.example.com/defs.svg#img_test"></use> 
 
</svg>

не показано в Firefox и Safari, НО НОТА видна в Chrome. Может кто-нибудь, пожалуйста, скажите мне, что я делаю неправильно здесь?

PS: Используя данные определения SVG inline работает во всех вышеупомянутых браузерах, но этот подход для меня не является вариантом, так как я хочу, чтобы SVG был кэширован браузером.

источник

2015-08-08 xpages-noob

Это показывает внешнюю работу над Firefox. Я не уверен, что вы сделали по-другому. http://www.w3.org/Graphics/SVG/Test/20110816/harness/htmlObjectApproved/struct-use-05-b.html –

@RobertLongson: Спасибо за подсказку. –

Проблема заключалась в том, что мой сервер не предоставил надлежащий 0M-код для ресурса файла svg. После ручной установки типа MIME в заголовке ответа на «image/svg + xml» он также работает в Firefox и Safari.

источник

2015-08-08 11:20:15

Внешние значки SVG не отображаются в Firefox

ответ

Смежные вопросы