SVG => использование

параметры

параметр	подробности
Икс	координата оси x верхнего левого угла
Y	координата оси Y верхнего левого угла
ширина	ширина элемента `<use>`
рост	высота элемента `<use>`
XLink: HREF	идентификатор ресурса (относится к идентификатору другого элемента). SVG 2 предлагает отказаться от этого и заменить его на простой атрибут href

замечания

Подробности можно найти в Рекомендации W3C для SVG, а также в новой Рекомендации кандидата по SVG2

Использование значка

Элемент <use> часто используется для повторного использования значков в сотрудничестве с элементом <symbol> . Это выглядит так:

<svg>
    <symbol viewBox="0 0 16 16" id="icon-star">
        <path d="M16 6.216l-6.095-.02L7.98.38 6.095 6.196 0 6.215h.02l4.912 3.57-1.904 5.834h.02l4.972-3.59 4.932 3.59-1.904-5.815L16 6.215" />
    </symbol>
</svg>

И элемент <use> :

<svg>
    <use xlink:href="#icon-star"/>
</svg>

Элемент <use> копирует <symbol> и отображает его. Вы также можете переопределить стили на <symbol> на отдельных элементах <use> , например

<style>
    .red {
        fill: red;
    }
</style>

<svg>
    <use class="red" xlink:href="#icon-star"/>
</svg>

Modified text is an extract of the original Stack Overflow Documentation

Лицензировано согласно CC BY-SA 3.0

Не связан с Stack Overflow

SVG
использование

Поиск…

параметры

замечания

Использование значка