192个CSS加载动画

*{

margin: 0;

padding: 0;

box-sizing: border-box;

font-family: 'Poppins', sans-serif;

}

body{

display: flex;

justify-content: center;

align-items: center;

min-height: 100vh;

background: #252839;

}

h2{

position: relative;

font-size: 14vw;

color: #252839;

-webkit-text-stroke: 0.3vw #383d52;

text-transform: uppercase;

}

h2::before{

content: attr(data-text);

position: absolute;

left: 0;

top: 0;

width: 0%;

height: 100%;

color: #01f387;

-webkit-text-stroke: 0vw #383d52;

border-right: 2px solid #01fe87;

overflow: hidden;

animation: toRight 5s linear infinite;

}

@keyframes toRight {

0%{

width: 0%;

}

70%{

width: 100%;

}

}