博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
纯css无缝滚动
阅读量:6470 次
发布时间:2019-06-23

本文共 684 字,大约阅读时间需要 2 分钟。

原理:

图片描述

复制一份需要无缝滚动的区域

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

animation css3动画

/*核心css*/@keyframes moveup{    0% {        transform: translateY(0);    }    100% {        transform: translateY(-100%);    }}.box { animation: moveup 10s  linear infinite; }.page { overflow: hidden; }/*样式*/.page { margin-top: 200px; height: 100px; border-top: 2px solid lightblue; border-bottom: 2px solid red; }.box {margin: 0;}.box li{ line-height: 30px; }

浏览器支持(需加css前缀):IE10+ Chrome FF android2.3+ safair5.1+

转载地址:http://vujko.baihongyu.com/

你可能感兴趣的文章
GlobalSign 域名型 SSL 证书
查看>>
Linux与云计算——第二阶段Linux服务器架设 第七章:网站WEB服务器架设—用户目录虚拟主机和SSL...
查看>>
关于HTML5你必须知道的28个新特性,新技巧以及新技
查看>>
Java9最新特性有哪些?
查看>>
linux中/etc/passwd和/etc/shadow中各个字段的含义
查看>>
oracle之基本介绍及认证
查看>>
爱创课堂每日一题第十六天为什么HTTPS安全?
查看>>
风险预警·11g容易被忽略的导入性能问题
查看>>
如何找到使用驱动器中的光盘之前需要格式化硬盘的数据
查看>>
micro-mvc框架支撑mvc各层代码热部署
查看>>
MySQL数据库管理4
查看>>
四月技术指标实现过程
查看>>
阿里云加入 OCI,共建容器开放标准
查看>>
人工智能是否可能会毁灭地球?
查看>>
PCB设计中都有哪些常见的孔?
查看>>
Java分布式锁,搞懂分布式锁实现看这篇文章就对了
查看>>
什么平台可以找到问答营销模式更好的玩法?
查看>>
Scala的方法和函数
查看>>
Linux运维跳槽必备面试题
查看>>
细述编程语言的发展过程
查看>>