技术栈

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机制
相关推荐
林恒smileZAZ
3 小时前
Vue<前端页面版本检测>
前端·javascript·vue.js
码事漫谈
6 小时前
当AI开始“思考”:我们是否真的准备好了?
前端·后端
许杰小刀
7 小时前
ctfshow-web文件包含(web78-web86)
android·前端·android studio
我是Superman丶
7 小时前
Element UI 表格某行突出悬浮效果
前端·javascript·vue.js
恋猫de小郭
7 小时前
你的代理归我了:AI 大模型恶意中间人攻击,钱包都被转走了
前端·人工智能·ai编程
xiaokuangren_
8 小时前
前端css颜色
前端·css
Huanzhi_Lin
8 小时前
关于V8/MajorGC/MinorGC——性能优化
javascript·性能优化·ts·js·v8·新生代·老生代
hoiii187
8 小时前
C# 基于 LumiSoft 实现 SIP 客户端方案
前端·c#
anOnion
8 小时前
构建无障碍组件之Meter Pattern
前端·html·交互设计
小码哥_常
9 小时前
Spring Boot配置diff:解锁配置管理新姿势
前端
热门推荐
01GitHub 镜像站点02一周AI热点速览(2026.03.31-04.06):GPT-6曝光、谷歌开源Gemma 4、资本狂飙与模型军备竞赛03OpenClaw 请求超时 llm request timed out 怎么解决?3 种方案实测,附完整排查流程04VMware Workstation Pro 17 虚拟机完整安装教程(2026最新)05基于 Docker 部署 Hermes Agent 并接入飞书机器人的完整指南06AI 编程效率翻倍:Superpowers Skills 上手清单 + 完整指南07UV安装并设置国内源08实测!Gemma 4 成功跑在安卓手机上:离线 AI 助手终于来了09Oh My Codex 快速使用指南10CodeBuddy与WorkBuddy深度对比:腾讯两款AI工具差异及实操指南