<!DOCTYPE html>
<html lang="en">
<div class="wrap">
<ul class="list">
的撒看到那是的啦了分你兰萨辽宁大连
</ul>
</div>
</html>

<style>
* {
margin:0;
padding:0;
}
.wrap {
overflow:hidden;
width:500px;
height:100px;
border:1px solid #000;
margin:50px auto;
}
.list {
position:relative;
top:0px;
left:0px;
width:200%;
height:100%;
border:1px solid #f00;
list-style:none;
animation:mymove 3s infinite linear; //滑动速度控制
}
@-webkit-keyframes mymove {
from {
left:0px;
}
to {
left:-300px;
}
}
</style>

效果：

    的撒看到那是的啦了分你兰萨辽宁大连

* { margin: 0; padding: 0 }
.wrap { overflow: hidden; width: 500px; height: 100px; border: 1px solid rgba(0, 0, 0, 1); margin: 50px auto }
.list { position: relative; top: 0; left: 0; width: 200%; height: 100%; border: 1px solid rgba(255, 0, 0, 1); list-style: none; animation: 3s linear infinite mymove }
@-webkit-keyframes mymove {
from {
left:0px;
}
to {
left:-300px;
}
}

css3自动滚动的更多相关文章

  1. Android点击列表后弹出输入框，所点击项自动滚动到输入框上方

    使用微信的朋友圈会发现,点击某一条评论后输入框会弹出来,然后所点击的那一项会自动地滚动到输入框上方的位置,这样如果开始所点击的评论在屏幕很下方的话,就不会被输入框遮住,虽然微信这一点在我的MX2频繁点 ...

  2. iOS 图片轮播图（自动滚动）

    iOS 图片轮播图(自动滚动) #import "DDViewController.h" #define DDImageCount 5 @interface DDViewContr ...

  3. Android 文字自动滚动（跑马灯）效果的两种实现方法[特别好使]

    有时候在xml中写的跑马灯效果不滚动:原因有以下 Android系统中TextView实现跑马灯效果,必须具备以下几个条件: 1.android:ellipsize=”marquee” 2.TextV ...

  4. EUI 自动滚动的聊天文本

    一 自动滚动的聊天文本 当文本输入改变时,将scrollV值等于maxScrollV值. private scrollLabel:eui.Label; egret.Tween.).call(()=&g ...

  5. js点击左右滚动+默认自动滚动类

    js点击左右滚动+默认自动滚动类 点击下载

  6. Android 如何实现带滚动条的TextView，在更新文字时自动滚动到最后一行？

    1.在布局文件中放置一个TextView,给它添加scrollbars和fadeScrollbars两个属性. 如下设置:滚动条为垂直滚动条,并且一直可见(当TextView中的文字行数超过页面能显示 ...

  7. JAVA 如何使JScrollPane中的JTextArea自动滚动到最后一行？

    1.要使JTextArea带有滚动条,需将JTextArea对象添加到JScrollPane中. JTextArea logArea = new JTextArea(15, 35); //创建JTex ...

  8. Android文字跑马灯控件（文本自动滚动控件）

    最近在开发一个应用,需要用到文本的跑马灯效果,图省事,在网上找,但老半天都找不到,后来自己写了一个,很简单,代码如下: import android.content.Context; import a ...

  9. WPF TextBox自动滚动到最户一行

    textBox经常用来显示程序的运行状态或者消息,如何让他自动滚动呢? 在显示消息代码下加一条自动滚动到底部的语句即可: TextBox1.ScrollToEnd(); (如果要显示垂直滚动条设置Ve ...

  10. Android:TextView 自动滚动(跑马灯) （转）

    Android:TextView 自动滚动(跑马灯)       TextView实现文字滚动需要以下几个要点: 1.文字长度长于可显示范围:android:singleLine="true ...

随机推荐

  1. 在Cloudreve网盘系统中集成kkFileView在线预览（暂时）

    服务器:WindowsServer 2016 Cloudreve 需求方想整一个在小团队内部使用的网盘系统,最终在千挑万选之下选中了Cloudreve. Github地址:https://github ...

  2. 使用.NET7和C#11打造最快的序列化程序-以MemoryPack为例

    译者注 本文是一篇不可多得的好文,MemoryPack 的作者 neuecc 大佬通过本文解释了他是如何将序列化程序性能提升到极致的:其中从很多方面(可变长度.字符串.集合等)解释了一些性能优化的技巧 ...

  3. “XZ”格式文件解压

    1.下载xz 官网:https://tukaani.org/xz/ 例:wget https://nchc.dl.sourceforge.net/project/lzmautils/xz-5.2.6. ...

  4. python文件名解析---从文件名获得分类类别

    python文件名解析-从文件名获得分类类别 python os.listdir() 方法用于返回指定的文件夹包含的文件或文件夹的名字的列表.列表以字母顺序. listdir()方法 举例说明 lis ...

  5. Windows10下python3和python2同时安装（一）安装python3和python2

    Windows10下python3和python2同时安装(一) 安装python3和python2 特别说明,本文是在Windows64位系统下进行的,32位系统请下载相应版本的安装包,安装方法类似 ...

  6. 02.JavaScript学习笔记1

    1.强制类型转换 当使用加号进行运算时,会将数字强制转换为字符串,然后再进行运算. const year = '1991'; console.log(year + 18); console.log(t ...

  7. vue中mixins（混入）的用法

    vue中mixin的使用详解 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能.一个混入对象可以包含任意组件选项.当组件使用混入对象时,所有混入对象的选项将被&quo ...

  8. (Java)设计模式：结构型

    前言 这篇博文续接的是 UML建模.设计原则.创建型设计模式.行为型设计模式,有兴趣的可以看一下 3.3.结构型 这些设计模式关注类和对象的组合.将类和对象组合在一起,从而形成更大的结构 * 3.3. ...

  9. Miller_Rabin质数测试

    数论 Miller_Rabin质数测试 作用 当需要判断一个数字是否是质数时,又发现数字过大,\(0(\sqrt n)\)难以承受的时候,就可以使用Miller_Rabin质数测试 基本定理 定理一, ...

  10. 第三方模块的下载与使用 requests模块 openpyxl模块

    今日内容 第三方模块下载操作 第三方模块: 别人写的魔魁啊 一般情况下都很强大 python中模块很多 如果想使用第三方模块 第一次必须先下载 后面就可以反复使用 =内置模块 下载第三方模块的方式: ...