简单粗暴,直接把下面的代码 替换即可。 多余的问题 自己研究。
先看效果图,有没有高端大气上档次!
代码自行优化! !!
因为本站有cdn缓存,所以css直接写里边了,你可以把CSS规范化了,单独写一个css文件 并引入
老规矩! 替换前 先备份! 备份 备份 备份
下面的代码 复制到:www/wwwroot/你的网址/wp-content/themes/riplus/pages/ 的 login.php
该内容需要权限查看
解锁内容将下面的代码 复制到 www/wwwroot/你的网址/wp-content/themes/riplus/pages/ 的 register.php
该内容需要权限查看
解锁内容下载css文件
[riplus-buttons size="btn-lg" type="btn-primary" href="https://cdn.okmg.cn/wp-content/uploads/2021/09/1632979283-2c0051d2cb84622.zip"]下载tailwind.min[/riplus-buttons]
解压缩后 上传到www/wwwroot/你的网址/wp-content/themes/riplus/assets/css/
将下边的css代码 复制到主题后台的自定义样式中,或自己找个css文件放进去!!!
.circles {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
.circles li {
position: absolute;
display: block;
list-style: none;
width: 20px;
height: 20px;
background: rgba(255, 255, 255, 0.2);
animation: animate 25s linear infinite;
bottom: -150px;
}
.circles li:nth-child(1) {
left: 25%;
width: 80px;
height: 80px;
animation-delay: 0s;
}
.circles li:nth-child(2) {
left: 10%;
width: 20px;
height: 20px;
animation-delay: 2s;
animation-duration: 12s;
}
.circles li:nth-child(3) {
left: 70%;
width: 20px;
height: 20px;
animation-delay: 4s;
}
.circles li:nth-child(4) {
left: 40%;
width: 60px;
height: 60px;
animation-delay: 0s;
animation-duration: 18s;
}
.circles li:nth-child(5) {
left: 65%;
width: 20px;
height: 20px;
animation-delay: 0s;
}
.circles li:nth-child(6) {
left: 75%;
width: 110px;
height: 110px;
animation-delay: 3s;
}
.circles li:nth-child(7) {
left: 35%;
width: 150px;
height: 150px;
animation-delay: 7s;
}
.circles li:nth-child(8) {
left: 50%;
width: 25px;
height: 25px;
animation-delay: 15s;
animation-duration: 45s;
}
.circles li:nth-child(9) {
left: 20%;
width: 15px;
height: 15px;
animation-delay: 2s;
animation-duration: 35s;
}
.circles li:nth-child(10) {
left: 85%;
width: 150px;
height: 150px;
animation-delay: 0s;
animation-duration: 11s;
}
@keyframes animate {
0% {
transform: translateY(0) rotate(0deg);
opacity: 1;
border-radius: 0;
}
100% {
transform: translateY(-1000px) rotate(720deg);
opacity: 0;
border-radius: 50%;
}
}
声明:
1、本站所有文章仅供参考,如有侵权 请联系我们删除 meng#yimiaonet.com #换成@
2、文章大部分源自网络或ai生成,文章不作为任何依据,仅供参考。
3、本站的所有源码都是在网络上转载或由用户投稿,仅供参考学习使用,请您务必在下载后24小时内删除。
4、本站下载的所有源码等内容不得用于任何违反相关法律法规的用途,一经发现 我们立即向有关部门报备。
5、如果您需要商用,可以联系客服定制开发或购买商业源码栏目内的内容,当然也可以联系部分源码的原作者;我们最终一切版权。
6、您注册本站会员后,如果需要注销账号等适宜,请联系客服。
评论(0)