一个css让图标旋转起来


先看效果

鼠标放在图片上静止一会儿,图片就会旋转起来

实现

实现其实很简单,一个样式就可以了

HTML 全选
<img class="img-turn" src="https://www.yesdotnet.com/images/logo.png" />
<style>
.img-trun:hover {
    transform: rotate(666turn);
    transition-delay: 1s;
    transition-property: all;
    transition-duration: 59s;
    transition-timing-function: cubic-bezier(.34,0,.84,1);
}
</style>

 

版权声明:本文为YES开发框架网发布内容,转载请附上原文出处连接
张国生
上一篇:C# NPOI导出excel绑定列的下拉数据源
下一篇:VSCode快捷键
评论列表

发表评论

评论内容
昵称:
关联文章

一个css图标旋转起来
制作一个标准 ICO 图标
[WPF] 抄一个 CSS3 实现的按钮
LeetCode:旋转图像
UI图标下载
CSS RGB函数 LESS问题
维护项目中的iconfont图标
WPF 布局 在有限空间内两个元素尽可能撑开的例子
fastreport文本旋转竖排
系统Icon图标规范,参考线
C#电脑发出声音
CSS设置奇偶行(交替行)颜色样式
WPF开发随笔收录-自定义图标控件
[原创] Devexpress表格GridView展示星级等级星星图标
CSS cursor 属性值
白象食品是怎么样的一个企业
[WPF] 使用 Shazzam Shader Editor 编写一个 Lighten Effect
Devexpress使用自带的图标图标
Yarp 系统内调度更灵活
CSS鼠标hover 背景动画煽动效果

联系我们
联系电话:15090125178(微信同号)
电子邮箱:garson_zhang@163.com
站长微信二维码
微信二维码