Vue中添加旋转动画

// 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);
    }
相关推荐
董世昌413 分钟前
null和undefined的区别是什么?
java·前端·javascript
软弹9 分钟前
Vue2 的数据响应式原理&&给实例新增响应式属性
前端·javascript·vue.js
浅水壁虎10 分钟前
任务调度——XXLJOB3(执行器)
java·服务器·前端·spring boot
晚霞的不甘11 分钟前
Flutter 布局核心:构建交互式文档应用
开发语言·javascript·flutter·elasticsearch·正则表达式
晨欣15 分钟前
pnpm vs npm 命令对照表
前端·npm·node.js
小二·21 分钟前
Python Web 开发进阶实战:AI 智能体操作系统 —— 在 Flask + Vue 中构建多智能体协作与自主决策平台
前端·人工智能·python
Knight_AL38 分钟前
Flink 状态管理详细总结:State 分类、Keyed State 实战、Operator State、TTL、状态后端选型
前端·数据库·flink
无心水1 小时前
17、Go协程通关秘籍:主协程等待+多协程顺序执行实战解析
开发语言·前端·后端·算法·golang·go·2025博客之星评选投票
weixin_638303111 小时前
uniapp组合式和选项式
javascript·vue.js·uni-app
【赫兹威客】浩哥1 小时前
【赫兹威客】框架模板-前端命令行部署教程
前端·vue.js