DOCTYPE html>< /span>
<html lang="en">
<head >
<meta charset="UTF-8">
<title >Documenttitle>
<style type="text/css">
html,body{
padding: 0;
margin: 0;
width: 100%;
height: 100%;
}
body{
display: flex;
align-items:center;
justify-content:center;
}
.wrap{
height: 250px;
width: 40px;
line-height: 40px;
font-size: 30px;
word-break: break-all;
word-wrap: break-word;
background-image: -webkit-linear-gradient(top,#FFFAF0,#FFEC8B 25%,#FFC125 50%,#FFA500 75%,#FF7F24);
-webkit-text-fill-color:transparent;
-webkit-background-clip: text;
-webkit-background-size: 100% 200%;
-webkit-animation: text-change 2s infinite linear;
}
@-webkit-keyframes text-change {
0%{ background-position: 0 0;}
100% { background-position:0 -100%;}
}
style>
head>
<body >
<div class="wrap a">Text gradient testdiv>
<div class="wrap ab">Text gradient testdiv>
body>
html>
DOCTYPE html>
<html lang="en">
<head >
<meta charset="UTF-8">
<title >Documenttitle>
<style type="text/css">
html,body{
padding: 0;
margin: 0;
width: 100%;
height: 100%;
}
body{
display: flex;
align-items:center;
justify-content:center;
}
.wrap{
height: 250px;
width: 40px;
line-height: 40px;
font-size: 30px;
word-break: break-all;
word-wrap: break-word;
background-image: -webkit-linear-gradient(top,#FFFAF0,#FFEC8B 25%,#FFC125 50%,#FFA500 75%,#FF7F24);
-webkit-text-fill-color:transparent;
-webkit-background-clip: text;
-webkit-background-size: 100% 200%;
-webkit-animation: text-change 2s infinite linear;
}
@-webkit-keyframes text-change {
0%{ background-position: 0 0;}
100% { background-position:0 -100%;}
}
style>
head>
<body >
<div class="wrap a">Text gradient testdiv>
<div class="wrap ab">Text gradient testdiv>
body>
html>
