技术栈

Vue中添加旋转动画

不吃香菜的猪2023-10-03 23:50

// transform: scale(1.2) rotate(-180deg); 放大 + 旋转

// transform: rotate(-180deg); 旋转

html 复制代码
    <i class="el-icon-close"></i>

    i {
      font-size: 20px;
      line-height: 24px;
      transition: transform 0.2s linear;
    }
    
    i:hover {
      color: red;
      transform-origin: center center;
      transform: scale(1.2) rotate(-180deg);
    }
上一篇:EasyX图形库note4,动画及键盘交互
下一篇:Linux 安全 - Capabilities机制
相关推荐
energy_DT
21 分钟前
2026年十五五油气田智能增产装备数字孪生,CIMPro孪大师赋能“流动增产工厂”三维可视化管控
前端
龙猫里的小梅啊
25 分钟前
CSS(四)CSS文本属性
前端·css
MXN_小南学前端
32 分钟前
watch详解:与computed 对比以及 Vue2 / Vue3 区别
前端·javascript·vue.js
饭小猿人
37 分钟前
Flutter实现底部动画弹窗有两种方式
开发语言·前端·flutter
让学习成为一种生活方式
1 小时前
pbtk v 3.5.0安装与使用--生信工具084
前端·chrome
heimeiyingwang
1 小时前
【架构实战】FinOps云成本优化实践
前端·chrome·架构
2601_94981469
1 小时前
Docker部署Spring Boot + Vue项目
vue.js·spring boot·docker
Mr Xu_
2 小时前
从后端数据到前端图表:深入解析 reduce 与 flatMap 的数据整形实战
前端·javascript
玖玖passion
2 小时前
Windows 上部署 Hermes Agent 完整指南 - 让你的 AI 助手在 WSL2 中跑起来
前端·后端·github
热门推荐
012026年4月技术前沿:AI大模型爆发、智能体革命与量子安全新纪元02GitHub 镜像站点03近期有什么ai的新消息,新动态? 2026.4月042026年4月AI大事件深度解读:大模型竞争进入“深水区“05codex app每次打开重连5次Reconnecting问题解决062026年AI前瞻:量子AI、具身智能与科学发现的新纪元07AI Weekly | 2026年4月第二周 · GitHub热门项目与AI发展趋势深度解析08CC-Switch & Claude 基于 Linux 服务器安装使用指南092026 年 AI 编程助手全面对比评测:Cursor vs Copilot vs Claude Code vs GitHub Copilot Free10Ubuntu 26.04 换国内源 清华源 阿里源 中科大源 华为源