2

Svg берется из спрайта

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
        <symbol id="cw_svg_like" viewBox="0 0 150 150">
            <path d="m107.50674,0.343053c-12.701078,0 -24.59057,5.750621 -32.506733,15.385707c-7.916163,-9.635414 -19.805327,-15.385707 -32.506733,-15.385707c-23.210382,0 -42.093616,18.882906 -42.093616,42.093616c0,18.17494 10.837545,39.197155 32.210955,62.482629c16.448475,17.919496 34.341738,31.794177 39.433908,35.619945l2.954502,2.219647l2.954502,-2.219319c5.092171,-3.825768 22.986089,-17.700121 39.434892,-35.619617c21.374066,-23.285474 32.211939,-44.308016 32.211939,-62.483285c0,-23.21071 -18.883234,-42.093616 -42.093616,-42.093616zm2.634458,97.924189c-13.529388,14.739061 -28.085146,26.653803 -35.142175,32.145044c-7.056701,-5.491241 -21.611803,-17.406311 -35.141191,-32.145372c-19.378055,-21.111407 -29.620765,-40.417321 -29.620765,-55.830245c0,-17.786035 14.470172,-32.256207 32.256207,-32.256207c11.704549,0 22.511926,6.379232 28.204834,16.648502l4.301899,7.760404l4.301899,-7.760404c5.69258,-10.268943 16.499958,-16.648502 28.204834,-16.648502c17.786035,0 32.256207,14.469844 32.256207,32.256207c0,15.41358 -10.243038,34.719494 -29.621749,55.830573z"/>
        </symbol>
</svg>

И вставляется на страницу

svg
 use(xlink:href="./images/cw_sprite.svg#cw_svg_like")

При таком методе svg не отображается в Firefox. На стеке уже есть подобная тема, но решение из нее мне не помогло.

1 ответ 1

2

Не помогло, потому-что надо немного изменить ваш код вызова иконок из спрайта

<svg viewBox ="0 0 48 48">
 <use xlink:href="./images/cw_sprite.svg#cw_svg_like"></use>
</svg>     

а перед этим нужно обязательно добавить спрайт в HTML с помощью тега <object>

<object type="image/svg+xml" data="sprite.svg">
   Your browser does not support SVG
</object>             

Вот здесь подробно разбиралась тема добавления иконок из спрайта.

1
  • Вам нет цены! Спасибо)
    – Dmitry N
    1 дек 2017 в 9:23

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.