使用css仅启动div中图标的一个过渡

使用CSS可以通过过渡（transition）属性来实现仅启动div中图标的过渡效果。过渡属性可以在元素的状态改变时，为其添加动画效果。

首先，需要在CSS中定义一个包含图标的div，并设置其样式和初始状态。例如：

.icon-div {
  width: 100px;
  height: 100px;
  background-color: #f00;
  transition: background-color 0.5s ease;
}

.icon-div:hover {
  background-color: #00f;
}

在上述代码中，我们定义了一个宽高为100px的div，并设置其背景色为红色。通过transition属性，我们指定了在背景色改变时应用动画效果，动画持续时间为0.5秒，过渡效果为ease（缓动效果）。

接下来，当鼠标悬停在该div上时，我们通过:hover伪类选择器来改变其背景色为蓝色。由于我们在初始状态中已经定义了过渡效果，因此背景色的改变将会以动画的形式展现出来。

这样，当鼠标悬停在div上时，图标的背景色将平滑地过渡为蓝色，给用户带来良好的交互体验。

腾讯云相关产品和产品介绍链接地址：

• 腾讯云官网：https://cloud.tencent.com/
• 云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
• 云存储（COS）：https://cloud.tencent.com/product/cos
• 人工智能（AI）：https://cloud.tencent.com/product/ai
• 物联网（IoT）：https://cloud.tencent.com/product/iotexplorer
• 移动开发（移动推送、移动分析）：https://cloud.tencent.com/product/mps
• 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
• 区块链服务（BCS）：https://cloud.tencent.com/product/bcs
• 腾讯会议：https://cloud.tencent.com/product/tc-meeting