Я использовал Figma, чтобы создать анимированный текст -> щелчок правой кнопкой мыши -> скопировать как SVG и вставить в файл html, но когда я обновляю sh веб-страницу, текст не отображается, просто белый полоса под изображением, которое уже было в файле html. Не могли бы вы мне помочь? Это очень печально.
Теперь код SVG-анимации невероятно длинный и полный цифр, поэтому я скажу вам проще
@import './birds-animation';
body {
position: relative;
height: 100vh;
width: 100vw;
padding: 0;
margin: 0;
}
<!DOCTYPE html>
<html>
<head>
<title>icy-blues</title>
<link rel="stylesheet" type="text/css" href="website1.css">
<meta charset="UTF-8">
<meta name="description" content="stufffff">
<meta name="keywords" content="stuff2">
<meta name="author" content="Ray">
</head>
<body>
<div class="birds-container">
<div class="bird-container bird-container--one">
<div class="bird bird--one"></div>
</div>
<div class="bird-container bird-container--two">
<div class="bird bird--two"></div>
</div>
<div class="bird-container bird-container--three">
<div class="bird bird--three"></div>
</div>
<div class="bird-container bird-container--four">
<div class="bird bird--four"></div>
</div>
</div>
<svg width="850" height="118" viewBox="0 0 850 118" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_b)">
<path d="numbersAndLetters" fill="#004756"/>
then more of these path elements
</g>
<defs>
<filter id="filter0_b" x="-4" y="-4" width="857.902" height="125.083" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feGaussianBlur in="BackgroundImage" stdDeviation="2"/>
<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur" result="shape"/>
</filter>
</defs>
</svg>
</body>
</html>