я новичок в этой области, не могу разобраться как вставить изображение(растянуть его по красной фигуре)
-
надо реализовать при помощи библиотек php– Никита Белов14 мая 2019 в 20:44
-
Не выдумывайте лишнего.. Не нужны тут никакие библиотеки, достаточно 'css3 transform' (в теории transform, так-то я в сss3 не особо шарю)– InDevX14 мая 2019 в 21:07
-
нужна деформация или просто маска?– Stranger in the Q14 мая 2019 в 21:12
-
Вот Вам растянуть по красной фигуре. Но зачем синий прямоугольник здесь?! Я сегодня точно не усну - буду доискиваться! :)– Sergey Nudnov16 мая 2019 в 23:26
1 ответ
Я в этом случае воспользовался inkscape так как он мне удобен просто но можно использовать adobe illustrator, corel draw, или любой другой векторный редактор
Я нарисовал нужный контур ..сначала сделал прямоугольник и без добавление точек согнул верхние и нижние грани бывшего прямоугольника
Скопировал вашу картинку из вопроса и поставил её на pattern и в качестве заливки применил этот pattern , получилось вот это ..
<svg version="1.1" viewBox="0 0 542 251" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<pattern id="pattern" width="542.39502" height="260.444" patternTransform="translate(.05 -10)" patternUnits="userSpaceOnUse">
<image width="542" height="260" image-rendering="optimizeSpeed" preserveAspectRatio="none" xlink:href="https://i.stack.imgur.com/IhhV0.jpg"/>
</pattern>
</defs>
<path d="m0 51c227-80 377-54 542 0v200c-232-76-365-40-542 0z" fill="url(#pattern)"/>
</svg>