css3实现div自动左右动
2024-09-05 12:30:28
<!DOCTYPE html>
<meta charset="UTF-8"/>
<html> <head>
<style>
div {
width: 100px;
height: 100px;
background: red;
position: relative;
animation: myfirst 5s infinite alternate;
} @keyframes myfirst {
0% {
background: red;
left: 0px;
top: 0px;
} 100% {
background: blue;
left: 200px;
top: 0px;
} }
//鼠标划过停止动画效果
div:hover{
-webkit-animation-play-state:paused;
animation-play-state:paused;
}
</style>
</head>
<body>
<div></div>
</body> </html>
最新文章
- Mimikatz 使用Tips
- SQLBulkCopy使用实例--读取Excel写入数据库/将 Excel 文件转成 DataTable
- 我的OpenCV学习笔记：VideoCapture类
- Angular.JS学习笔记——1
- PHP学习之登录以及后台商品展示
- jquery datatable(二)
- 利用HTML5的一个重要特性 —— DeviceOrientation来实现手机网站上的摇一摇功能
- ACM算法总结及刷题参考
- windows 配置免安装 node
- bnu 4358 左手定则 （搜索）
- c# int类型的转datetime类型
- Programming for Everyone !
- 【Java每日一题】20170119
- Dirichlet's Theorem on Arithmetic Progressions POJ - 3006 线性欧拉筛
- 【数论&想法题】小C的问题 @"科林明伦杯"哈尔滨理工大学第八届程序设计竞赛
- mysql 开发进阶篇系列 35 工具篇 mysqldump(数据导出工具)
- jQuery js 中return false,e.preventDefault(),e.stopPropagation()的区别(事件冒泡)
- C# 获取listview中选中一行的值
- Linux中CentOS6.5 64位 系统下安装docker步骤
- jquey XMLHttpRequest cannot load url.Origin null is not allowed by Access-Control-Allow-Origin