星子县网站建站公司,seo的主要工作是什么,上海网站,免费微信网站开发#x1f345; 作者主页#xff1a;Java李杨勇 #x1f345; 简介#xff1a;Java领域优质创作者#x1f3c6;、Java李杨勇公号作者✌ 简历模板、学习资料、面试题库、技术互助【关注我#xff0c;都给你】 #x1f345; 欢迎点赞 #x1f44d; 收藏 ⭐留言 #x1f… 作者主页Java李杨勇 简介Java领域优质创作者、Java李杨勇公号作者✌ 简历模板、学习资料、面试题库、技术互助【关注我都给你】 欢迎点赞 收藏 ⭐留言 效果演示 文末获取源码 主要代码实现 CSS样式
import url(https://fonts.googleapis.com/css2?familyAveriaSansLibre:wght700displayswap);
body {margin: 0;padding: 0;background: #131417;font-family: Averia Sans Libre, Arial, sans-serif;overflow: hidden;
}.content {height: 100vh;width: 100vw;background: radial-gradient(#673ab7 15%, #000000 100%);text-align: center;padding: 15vh;box-sizing: border-box;
}.thanks,
.followers {font-size: 12vmin;color: #673ab799;text-align: center;text-shadow: -0.25vmin 0.25vmin 0vmin #00000026;position: absolute;width: 100%;left: 0;
}.thanks {animation: go-down 1s ease 0s 1;top: 15vh;
}.followers {bottom: 15vh;animation: go-up 2s ease 0s 1;text-shadow: -0.25vmin -0.25vmin 0vmin #00000026;
}.number {color: #ffffff;font-size: 40vmin;font-weight: bold;line-height: 33vmin;text-shadow: 0vmin 1vmin 0vmin #b5b5b5, -1vmin 2vmin 0 #333, 1vmin 2vmin 0 #333, -1vmin 2.5vmin 0 #333, 1vmin 2.5vmin 0 #333, 0.4vmin 2.55vmin 0 #333, -0.25vmin 2.55vmin 0 #333, -1vmin 3.55vmin 0 #222, -0.25vmin 3.55vmin 0 #222, 0.25vmin 3.55vmin 0 #222, 0.75vmin 3.55vmin 0 #222;animation: go-front 2s linear 0s 1;width: 100%;position: absolute;left: 0;top: calc(50% - 20vmin);
}keyframes go-down {0% {top: -100vh;}100% {top: 15vh;}
}keyframes go-up {0% {bottom: -100vh;}66% {bottom: -100vh;}100% {bottom: 15vh;}
}keyframes go-front {0% {top: -100vh;}33% {top: -100vh;}66% {top: calc(50% - 20vmin);}68% {top: calc(50% - 22vmin);}70% {top: calc(50% - 20.5vmin);}72% {top: calc(50% - 21.25vmin);}73% {top: calc(50% - 20vmin);}100% {top: calc(50% - 20vmin);}
}
HTML代码 :
!DOCTYPE html
html langenheadmeta charsetUTF-8titleThank You 200 Followers - 3D Text Experiment/titlelink relstylesheet hrefcss/style.css/headbodydiv classcontentdiv classthanksTHANK YOU/divdiv classnumber200/divdiv classfollowersFOLLOWERS/div/div/body/html 源码获取 大家可以点赞、收藏、关注、评论我啦 、查看博主主页或下方微信公众号获取更多~ 打卡 文章 更新 46 / 100天 精彩推荐更新中 HTML5大作业实战案例《100套》 Java毕设项目精品实战案例《100套》
