CSS：icon图标悬停时有底部背景色

📅 发布时间：2026/6/17 16:16:20 👁 浏览次数：

需要实现的效果如图所示

9388e3cd6969412ca4a257359be92fbd

当给icon加悬停背景色时，并且要求背景距离icon有一定的间距时，可以尝试给icon用img标签

⚠️注意：`padding` 加在img上，是给img外层元素加内边距

&-title {font-weight: 500;color: #0B111E;width: 100%;text-align: center;position: relative;  // 重点img {position: absolute;left: 0;width: 24PX;height: 24PX;padding: 6PX;   // 重点&:hover {background-color: #F0F3FA;border-radius: 8PX;}}
}

eb098110976a43c6baa5bbb35de99693