NM
вообще, если убираю оба use из примера твоего, то все пропадает
Size: a a a
2021 January 21
Мэй би потому что use отвечает за отображение элемента?
symbol это инициалзация примитива
А use его использование по id
вообще, если убираю оба use из примера твоего, то все пропадает
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100%">
<linearGradient id="fontGradient" x1="0" x2="0" y1="0" y2="1">
<stop offset="0%" stop-color="red"/>
<stop offset="50%" stop-color="black" stop-opacity="0"/>
<stop offset="100%" stop-color="blue"/>
</linearGradient>
<symbol id="stroke-dash">
<text fill="url(#fontGradient)" text-anchor="middle" x="50%" y="50%">TVOI DED HUESOS</text>
</symbol>
<use xlink:href="#stroke-dash" font-size="4em">
</use>
</svg>
Вот более простой пример, без лишнего кода
NM
а для чего здесь stroke-dash?🤔
Это id символа
Который я ипользую
Вообще можно без него обойтись, просто в старом коде это нужно было
Убираешь всё нахуй
Создаёшь элемент text, задаёшь ему аттрибут fill, в котором указываешь id заранее созданного градиента и оборачиваешь всё это в тег SVG
типа
<svg>
<linearGradient id="gradient" x1="0" x2="0" y1="0" y2="1">
<stop offset="0%" stop-color="red"/>
<stop offset="50%" stop-color="black" stop-opacity="0"/>
<stop offset="100%" stop-color="blue"/>
</linearGradient>
<text fill="url(#gradient)" font-size="4em">Я спрошу тебя дважды</text>
</svg>
<svg>
<linearGradient id="gradient" x1="0" x2="0" y1="0" y2="1">
<stop offset="0%" stop-color="red"/>
<stop offset="50%" stop-color="black" stop-opacity="0"/>
<stop offset="100%" stop-color="blue"/>
</linearGradient>
<text fill="url(#gradient)" font-size="4em">Я спрошу тебя дважды</text>
</svg>
NM
Убираешь всё нахуй
я если его убираю, все пропадает 😂
типа
<svg>
<linearGradient id="gradient" x1="0" x2="0" y1="0" y2="1">
<stop offset="0%" stop-color="red"/>
<stop offset="50%" stop-color="black" stop-opacity="0"/>
<stop offset="100%" stop-color="blue"/>
</linearGradient>
<text fill="url(#gradient)" font-size="4em">Я спрошу тебя дважды</text>
</svg>
<svg>
<linearGradient id="gradient" x1="0" x2="0" y1="0" y2="1">
<stop offset="0%" stop-color="red"/>
<stop offset="50%" stop-color="black" stop-opacity="0"/>
<stop offset="100%" stop-color="blue"/>
</linearGradient>
<text fill="url(#gradient)" font-size="4em">Я спрошу тебя дважды</text>
</svg>
Только придётся отпозиционировать сам текст
NM
а градиент горизонтальный сделать как?
а градиент горизонтальный сделать как?
Добавь к linearGradient аттрибут gradientTransform и укажи там rotate(x)
Только я не помню, нужно ли единицы указывать
А не
Погоди