技术栈

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机制
相关推荐
kyriewen11
3 小时前
你点的“刷新”是假刷新?前端路由的瞒天过海术
开发语言·前端·javascript·ecmascript·html5
摇滚侠
4 小时前
JAVA 项目教程《苍穹外卖-12》,微信小程序项目,前后端分离,从开发到部署
java·开发语言·vue.js·node.js
Timer@
4 小时前
LangChain 教程 04|Agent 详解:让 AI 学会“自己干活“
javascript·人工智能·langchain
阿珊和她的猫
4 小时前
TypeScript中的never类型: 深入理解never类型的使用场景和特点
javascript·typescript·状态模式
skywalk8163
5 小时前
Kotti Next的tinyfrontend前端模仿Kotti 首页布局还是不太好看,感觉比Kotti差一点
前端
RopenYuan
6 小时前
FastAPI -API Router的应用
前端·网络·python
走粥
7 小时前
clsx和twMerge解决CSS类名冲突问题
前端·css
Purgatory001
7 小时前
layui select重新渲染
前端·layui
weixin19970108016
8 小时前
《中国供应商商品详情页前端性能优化实战》
前端·性能优化
热门推荐
01GitHub 镜像站点02Qwen3.5-Omni与Qwen3.6模型全面解析(含测评/案例/使用教程)03VMware Workstation Pro 17 虚拟机完整安装教程(2026最新)04OpenClaw 请求超时 llm request timed out 怎么解决?3 种方案实测,附完整排查流程052026年3月AI领域大事件:DeepSeek引领开源风暴06【技术干货】Gemma 4 上手深度指南:本地多模态大模型的新基线07AI 编程效率翻倍:Superpowers Skills 上手清单 + 完整指南08纯 HTML/CSS/JS 实现的高颜值登录页,还会眨眼睛!少女心爆棚!09Claude Code + GLM4.7 避坑指南:解决 Unable to connect to Anthropic services10“wsl --install -d Ubuntu-22.04”下载慢,中国地区离线安装 Ubuntu 22.04 WSL方法(亲测2025年5月6日)