<!doctype html> <html> <head> <meta charset="utf-8"> <title>css光泽一闪而过的效果</title> <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script> <style> .box { position:relative; overflow:hidden; cursor:pointer; margin:0 auto; width:1000px; } @-webkit-keyframes changeImg { from { left:-100%; } 100% { left:150%; } } .shan { position:absolute; -webkit-animation:changeImg 3s ease 0s; -o-animation:changeImg 3s ease 0s; animation:changeImg 3s ease 0s; top:0; width:30%; height:100%; content:""; background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 100%); background:-o-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 100%); background:-moz-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 100%); background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 100%); transform:skewX(-45deg); animation-iteration-count:infinite; -moz-animation-iteration-count:infinite; -webkit-animation-iteration-count:infinite; } </style> </head> <body> <div class="box"> <img alt="" src="http://www.jq22.com/img/cs/500x300-2.png" style="display:block;"> <b class="shan"></b> </div> </body> </html>
css光泽一闪而过的效果（整理）
2023-09-16
134
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《
阿里云开发者社区用户服务协议》和
《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写
侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
css光泽一闪而过的效果（整理）
目录
相关文章
|
Web App开发
前端开发
CSS3 试试看
1. border-radius属性:
很好看的形状不再需要image来实现啦。。我们看看如何让一个DIV显示为不规则。并在里面存放一些文本。使用CSS3中的border-radius属性：
1
2
3
4
5
6
7
8
div
...
555
0
0
|
JavaScript
|
5月前
|
设计模式
移动开发
前端开发
|
Web App开发
前端开发
测试技术
抓信插件开发遇到网页的CSS不起作用
901
0
0
|
前端开发
你知道我们平时在CSS中写的%都是相对于谁吗？
1292
0
0
|
前端开发
JavaScript
|
Web App开发
前端开发
Java
|
前端开发
索引
容器
|
编解码
前端开发
JavaScript
|
Web App开发
移动开发
JavaScript
推荐几份能够帮助你学习 CSS3 的实用帮助手册
今天这篇文章向大家分享几份对学习 CSS3 非常有帮助的手册，大家记得收藏起来。CSS3 是对 CSS 规范的一个很大的改善和增强，它使得 Web 开发人员可以很容易的在网站中加入时尚的效果。以前很多需要编写 JavaScript 才能实现的效果，如今只需要简单的写几句 CSS3 代码就能实现。
803
0
0
热门文章
最新文章
1
讨论阶段性给予客户交付物所引发的风险问题
2
finally关键字小复习
3
静态变量和成员变量的区别 && 成员变量和局部变量的区别
4
我的博客即将入驻“云栖社区”，诚邀技术同仁一同入驻。
5
js获取 日期 星期 时间
6
Javascript事件集
7
Ruby中求50之内的素数方法
8
Unity应用架构设计(3)——构建View和ViewModel的生命周期
9
北大资源重磅来宜--宜昌未来商业中心将诞生
10
【android基础】Android中四大组件
1
Step-Video-T2V：碾压Sora？国产开源巨兽Step-Video-T2V杀到：300亿参数一键生成204帧视频
62
2
Unsloth：学生党福音！开源神器让大模型训练提速10倍：单GPU跑Llama3，5小时变30分钟
89
3
X-R1：3090也能训7B模型！开源框架X-R1把训练成本打下来了：10美元训出企业级LLM
39
4
Cline：29.7K Star！一文详解VSCode最强开源AI编程搭子：一键生成代码+自动跑终端+操控浏览器...
63
5
【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
14
6
新一代 Cron-Job 分布式任务调度平台 正式发布！
35
7
菜鸟之路Day15一一IO流（一）
19
8
《通义灵码2.0体验感受》
32
9
分库分表—2.详细介绍一
15
10
Dataphin离线数据开发规范
24