CSS3 clip裁剪动画
2024-09-02 00:15:23
CSS3 clip裁剪动画
下面是比较简单的例子
<pre>
<html>
<head>
<style type="text/css">
img
{
position:absolute;
clip:rect(0px 120px 151px 0px);
animation: clipMe 5s linear infinite;
}
@-webkit-keyframes clipMe {
0% {
}
100% {
clip:rect(0px 0px 151px 0px);
}
}
</style>
</head>
<body>
<p>clip 属性剪切了一幅图像:</p>
<p><img border="0" src="/i/eg_bookasp.gif" width="120" height="151"></p>
</body>
</html>
</pre>
如果clip属性不理解的看下面1张图 秒懂!!
<img src="http://newmiracle.cn/wp-content/uploads/2016/11/QQ截图20161105144011-300x167.jpg" alt="qq%e6%88%aa%e5%9b%be20161105144011" width="300" height="167" class="alignnone size-medium wp-image-390" />
最新文章
- Bagging与随机森林算法原理小结
- Android开发学习——ListView+BaseAdapter的使用
- 测试 ClownFish、CYQ、Entity Framework、Moon、MySoft、NHibernate、PDF、XCode数据访问组件性能
- 【BZOJ-2892&;1171】强袭作战&;大sz的游戏 权值线段树+单调队列+标记永久化+DP
- CentOS安装Erlang
- Runloop应用实例
- event.preventDefault()
- poj 1562 Oil Deposits (广搜,简单)
- Python中的函数对象与闭包
- 由abcd四个字符取5个作允许重复的排列,要求a出现次数不超过2次,但不能不出现;b不超过1个;c不超过3个;d出现的次数为偶数。求满足以上条件的排列数。
- Linux 上的游戏 Supertuxkart
- [置顶] github简单使用
- 神经网络BP算法C和python代码
- VMware Workstation 12 Pro 之安装林耐斯-Solus-系统
- 五分钟让你读懂UML常见类图
- mysql案例 ~ 主从复制延迟处理(3)
- ln -s 软连接介绍
- php分享十三:mysql事物
- parted分区脚本
- hello word 应用程序的编写