30 lines
447 B
SCSS
30 lines
447 B
SCSS
// 图片从0%到100%动画
|
|
.image-animated {
|
|
animation: logo-scale 0.3s ease-in-out;
|
|
}
|
|
|
|
@keyframes logo-scale {
|
|
0% {
|
|
transform: scale(0);
|
|
}
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
|
|
// 文字从0%到100%动画，从左到右
|
|
.text-animated {
|
|
animation: text-fade-in 0.3s ease-in-out;
|
|
}
|
|
|
|
@keyframes text-fade-in {
|
|
0% {
|
|
opacity: 0;
|
|
transform: translateX(-20px);
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
transform: translateX(0);
|
|
}
|
|
}
|