🎉 子比美化版热销中(跟本站一模一样)!
详情
评论
问答

您可以通过搜索或浏览分类列表来找到您期望下载的资源。随后,点击资源介绍页右侧的下载链接按钮,依据提示信息进行操作即可。

大部分资源可积分免费下载,部分资源须付费才能下载。

本网站提供的下载资源均为网络搜集,仅供个人学习和交流使用。对于版权问题,请用户自行判断并承担相应责任。

子比主题 – 底部添加波浪滚动

剑去主题

100元出售本站一模一样的模板,限时促销!

代码部署

代码一共两个部分,一个是svg的动态,一个是实现svg的CSS代码,话不多说直接跟着我的教程来就没有问题

将下面的代码放到/wp-content/themes/zibll/footer.php文件里面的<footer class="footer">的标签前面即可,如果不会的话直接看下图即可!

图片[1]-子比主题 – 底部添加波浪滚动-剑去主题

将下面的css代码放到:子比主题–>>自定义CSS样式 即可

/*网站底部波浪*/
.waves {
  position: relative;
  width: 100%;
  height: 15vh;
  margin-bottom: -7px;
  min-height: 50px;
  max-height: 80px;
}

.parallax>use {
  animation: move-forever 25s cubic-bezier(.55, .5, .45, .5)infinite;
}

.parallax>use:nth-child(1) {
  animation-delay: -2s;
  animation-duration: 7s;
}

.parallax>use:nth-child(2) {
  animation-delay: -3s;
  animation-duration: 10s;
}

.parallax>use:nth-child(3) {
  animation-delay: -4s;
  animation-duration: 13s;
}

.parallax>use:nth-child(4) {
  animation-delay: -5s;
  animation-duration: 20s;
}

@keyframes move-forever {
  0% {
    transform: translate3d(-90px, 0, 0);
  }

  100% {
    transform: translate3d(85px, 0, 0);
  }
}


@media (max-width:768px) {
  .waves {
    height: 40px;
    min-height: 40px;
  }

  .waves-inner {
    padding-top: 50px;
  }

  .mg-b {
    margin-bottom: 0;
  }

  .home_row {
    padding: 0px !important;
  }
}

.apply_link {
  float: right;
}
😉 阿里云产品年付99元续费99元热卖,戳我领取
👋 部分教程由剑去了无痕原创!受限水平,不足之处,请见谅!

全站教程均经过站长测试,如因版本更替出现错误,请提醒。
本站资源均为作者提供和网友投稿,仅供学习使用,请在下载后24小时内删除,谢谢合作!
© 版权声明
THE END
喜欢就支持一下吧
点赞117 分享
评论 共3条

请登录后发表评论

    暂无评论内容